如何深入淺析小程序中的全局配置

本篇文章給大家分享的是有關(guān)如何深入淺析小程序中的全局配置，小編覺(jué)得挺實(shí)用的，因此分享給大家學(xué)習(xí)，希望大家閱讀完這篇文章后可以有所收獲，話不多說(shuō)，跟著小編一起來(lái)看看吧。

全局配置文件及常用的配置項(xiàng)

小程序根目錄下的 app.json 文件是小程序的全局配置文件。常用的配置如下：

• pages：記錄當(dāng)前小程序所有頁(yè)面的存放路徑

• window：全局設(shè)置小程序窗口的外觀

• tabBar：設(shè)置小程序底部的 tabBar 效果

• style：是否啟用新版的組件樣式   【相關(guān)學(xué)習(xí)推薦：小程序開(kāi)發(fā)教程】

window

小程序窗口的組成部分

window 常用配置項(xiàng)

設(shè)置導(dǎo)航欄的標(biāo)題

app.json -> window -> navigationBarTitleText

設(shè)置導(dǎo)航欄的背景色

app.json -> window -> navigationBarBackgroundColor

設(shè)置導(dǎo)航欄標(biāo)題顏色

app.json -> window -> enablePullDownRefresh

全局開(kāi)啟下拉刷新（在 app.json 中啟用下拉刷新功能，會(huì)作用于每個(gè)小程序頁(yè)面）

下拉刷新：通過(guò)手指在屏幕上的下拉滑動(dòng)操作，從而重新加載頁(yè)面數(shù)據(jù)的行為

app.json -> window -> enablePullDownRefresh

設(shè)置下拉刷新時(shí)窗口的背景色

當(dāng)全局開(kāi)啟下拉刷新功能后，默認(rèn)的窗口背景為白色。設(shè)置自定義下拉刷新窗口背景色

app.json -> window -> backgroundColor

設(shè)置下拉刷新時(shí) loading 的樣式

當(dāng)全局開(kāi)啟下拉刷新功能后，默認(rèn)的窗口的 loading 為白色。設(shè)置 loading 樣式的效果

app.json -> window -> backgroundTextStyle

設(shè)置上拉觸底的距離

上拉觸底：通過(guò)手指在屏幕上的上拉滑動(dòng)操作，從而加載更多數(shù)據(jù)的行為

app.json -> window -> onReachBottomDistance

tabBar

什么是tabBar

• tabBar是移動(dòng)端應(yīng)用常見(jiàn)的頁(yè)面效果，用于實(shí)現(xiàn)多頁(yè)面的快速切換，小程序中將其分為倆種：

• 底部 tabBar

• 頂部 tabBar

• 注意：

• tabBar 中只能配置最少2個(gè)，最多5個(gè) tab 頁(yè)簽

• 當(dāng)渲染頂部 tabBar 時(shí)，不顯示 icon，只顯示文本

tabBar 的 6 個(gè)部分

tabBar 常用配置項(xiàng)

• tabBar 組件的配置項(xiàng)

  屬性	類型	必填	默認(rèn)值	說(shuō)明
  position	String	否	bottom	tabBar 的位置，僅支持 bottom
  borderStyle	String	否	black	tabbar 上邊框的顏色， 僅支持 black / white
  color	HexColor	否		tabBar上文字的默認(rèn)顏色（未選中）
  selectedColor	HexColor	否		tabBar選中時(shí)文字的默認(rèn)顏色
  backgroundColor	HexColor	否		tabBar的背景色
  list	Array	是		tabBar的頁(yè)簽列表，最少2個(gè)，最多5個(gè)

• 每個(gè) tab 項(xiàng)的配置選項(xiàng)

  屬性	類型	必填	說(shuō)明
  pagePath	String	是	頁(yè)面路徑，必須在 pages 中先定義
  text	String	是	tab 上按鈕文字
  iconPath	String	否	圖片路徑，icon 大小限制為 40kb，建議尺寸為 81px * 81px，不支持網(wǎng)絡(luò)圖片
  selectedIconPath	String	否	選中時(shí)的圖片路徑，icon 大小限制為 40kb，建議尺寸為 81px * 81px，不支持網(wǎng)絡(luò)圖片

頁(yè)面配置文件

頁(yè)面配置文件的作用

小程序中，每個(gè)頁(yè)面都有自己的 .json 配置文件，用來(lái)對(duì)當(dāng)前頁(yè)面的窗口外觀、頁(yè)面效果等進(jìn)行配置

頁(yè)面配置和全局配置的關(guān)系

• 小程序中，app.json 中的 window 節(jié)點(diǎn)，可以全局配置小程序中每個(gè)頁(yè)面的窗口表現(xiàn)

• 對(duì)小程序中某個(gè)頁(yè)面想要擁有特殊的窗口表現(xiàn)，此時(shí)需要對(duì)頁(yè)面級(jí)別的 .json 文件進(jìn)行修改

• 注意：

  當(dāng)頁(yè)面配置與全局配置沖突時(shí)，根據(jù)就近原則，最終的效果以頁(yè)面配置為準(zhǔn)

頁(yè)面配置中常用的配置項(xiàng)

小程序是什么意思

小程序是一種不需要下載安裝即可使用的應(yīng)用，通過(guò)掃描二維碼或是搜一搜立即使用，操作簡(jiǎn)單，便于傳播，能夠?qū)崿F(xiàn)消息通知、線下掃碼、公眾號(hào)關(guān)聯(lián)等七大功能。它基于微信運(yùn)行的，類似于APP，想用就用，用完即走，不會(huì)占用內(nèi)存。

以上就是如何深入淺析小程序中的全局配置，小編相信有部分知識(shí)點(diǎn)可能是我們?nèi)粘９ぷ鲿?huì)見(jiàn)到或用到的。希望你能通過(guò)這篇文章學(xué)到更多知識(shí)。更多詳情敬請(qǐng)關(guān)注億速云行業(yè)資訊頻道。