首頁 > 文章 > 微信小程式 > 微信小程式開發之全域配置的介紹

微信小程式開發之全域配置的介紹

不言原創: 2018-06-23 10:52:451814瀏覽

這篇文章主要介紹了微信小程式開發之全域配置的相關資料,需要的朋友可以參考下

一.app.json

使用app.json檔案來對微信小程式進行全域配置，決定頁面檔案的路徑、視窗表現、設定網路逾時時間、設定多tab 等.

則以注意.json不能註釋，否則會出錯。

二.工具列tabBar

如果我們的小程式是一個多tab 應用程式（客戶端視窗的底部或頂部有tab 欄位可以切換頁面），那麼我們可以透過tabBar 配置項目指定tab 欄的表現，以及tab 切換時顯示的對應頁面。

tabBar 是一個數組，只能配置最少2個、最多5個tab，tab 依數組的順序排序

#app.json中

{ 
 "pages": ["pages/index/index", 
    "pages/coming/coming", 
    "pages/search/search", 
    "pages/top/top" 
   ], 
 "window": { 
  "navigationBarBackgroundColor": "#47a86c", 
  "navigationBarTextStyle": "white", 
  "navigationBarTitleText": "小程序案例", 
  "backgroundColor": "#fff", 
  "backgroundTextStyle": "dark" 
 }, 
 "tabBar": { 
  "color": "#686868", 
  "selectedColor": "#47a86c", 
  "backgroundColor": "#fff", 
  "list": [{ 
   "pagePath": "pages/index/index", 
   "iconPath": "dist/images/popular_icon.png", 
   "selectedIconPath": "dist/images/popular_active_icon.png", 
   "text": "热映" 
  }, 
  { 
   "pagePath": "pages/coming/coming", 
   "iconPath": "dist/images/coming_icon.png", 
   "selectedIconPath": "dist/images/coming_active_icon.png", 
   "text": "待映" 
  }, 
  { 
   "pagePath": "pages/search/search", 
   "iconPath": "dist/images/search_icon.png", 
   "selectedIconPath": "dist/images/search_active_icon.png", 
   "text": "搜索" 
  }, 
  { 
   "pagePath": "pages/top/top", 
   "iconPath": "dist/images/top_icon.png", 
   "selectedIconPath": "dist/images/top_active_icon.png", 
   "text": "口碑" 
  }] 
 }, 
 "networkTimeout": { 
  "request": 10000, 
  "downloadFile": 10000 
 }, 
 "debug": true 
}

圖示可以放在與pages同級，檔案命名可是自訂。

app.json中其他屬性：可以查看官方文件。

以上就是本文的全部內容，希望對大家的學習有所幫助，更多相關內容請關注PHP中文網！

微信小程式 開發之全域配置的介紹

相關文章

微信小程式開發之全域配置的介紹