miniprogram-pageoptions
使用自定义组件来动态设置页面的属性
Getting Started
该组件依赖 微信小程序基础库 2.2.3 或以上版本
- 一个页面可以插入多个
miniprogram-pageoptions
组件,如果多个组件都设置了同一个页面属性,则以在节点树靠后的那个组件所设置的页面属性为准; - 目前支持动态设置的页面属性有
title
navigationBar
background
,分别对应的微信小程序 api 为wx.setNavigationBarTitle
wx.setNavigationBarColor
wx.setBackgroundTextStyle 和 wx.setBackgroundColor
; - 支持设置页面的分享功能;
The Gist
/* product-detail.js */const getPageShareContent = ;const loadProductDetail = ; /* product-detail.json */ "usingComponents": "pageoptions": "miniprogram-pageoptions" /* product-detail.wxml */<pageoptions title="{{title}}" shareContent="{{shareContent}}" /><view>商品详情...</view>
API Reference
<pageoptions />
from "miniprogram-pageoptions" - 动态设置页面属性
title
: String - 设置导航条的标题navigationBar
: String - 设置导航条的颜色,格式为"[前景色] [背景色]"
,例如"#000000 #ffffff"
background
: String - 设置背景的字体样式和背景色,格式为"[字体样式] [背景色] [顶部背景色] [底部背景色]"
,例如"dark #ffffff #ffffff #ffffff"
shareContent
: Object - 设置页面的分享内容
getPageShareContent
from "miniprogram-pageoptions/context" - 获取页面的分享内容
- @params
inst
- 所在页面的实例 - @return
shareContent
- 页面的分享内容