頁面配置
每一個小程序頁面也可以使用 .json
文件來對本頁面的窗口表現進行配置。頁面中配置項在當前頁面會覆蓋 app.json
的 window
中相同的配置項。文件內容為一個 JSON 對象,有以下屬性:
配置項
屬性 | 類型 | 默認值 | 描述 | 最低版本 |
---|---|---|---|---|
navigationBarBackgroundColor | HexColor | #000000 | 導航欄背景顏色,如 #000000 |
|
navigationBarTextStyle | string | white | 導航欄標題顏色,僅支持 black / white |
|
navigationBarTitleText | string | 導航欄標題文字內容 | ||
navigationStyle | string | default | 導航欄樣式,僅支持以下值:default 默認樣式custom 自定義導航欄,只保留右上角膠囊按鈕 |
微信客戶端 7.0.0 |
backgroundColor | HexColor | #ffffff | 窗口的背景色 | |
backgroundTextStyle | string | dark | 下拉 loading 的樣式,僅支持 dark / light |
|
backgroundColorTop | string | #ffffff | 頂部窗口的背景色,僅 iOS 支持 | 微信客戶端 6.5.16 |
backgroundColorBottom | string | #ffffff | 底部窗口的背景色,僅 iOS 支持 | 微信客戶端 6.5.16 |
enablePullDownRefresh | boolean | false | 是否開啟當前頁面下拉刷新。 詳見 Page.onPullDownRefresh |
|
onReachBottomDistance | number | 50 | 頁面上拉觸底事件觸發時距頁面底部距離,單位為px。 詳見 Page.onReachBottom |
|
pageOrientation | string | portrait | 屏幕旋轉設置,支持 auto / portrait / landscape 詳見 響應顯示區域變化 |
2.4.0 (auto) / 2.5.0(landscape) |
disableScroll | boolean | false | 設置為 true 則頁面整體不能上下滾動。只在頁面配置中有效,無法在 app.json 中設置 |
|
disableSwipeBack | boolean | false | 禁止頁面右滑手勢返回 | 微信客戶端 7.0.0 |
usingComponents | Object | 否 | 頁面自定義組件配置 | 1.6.3 |
頁面配置中只能設置
app.json
中window
對應的配置項,以決定本頁面的窗口表現,所以無需寫window
這個屬性。
配置示例
{ "navigationBarBackgroundColor": "#ffffff", "navigationBarTextStyle": "black", "navigationBarTitleText": "微信接口功能演示", "backgroundColor": "#eeeeee", "backgroundTextStyle": "light" }
.