微信小程序中全局配置開發的示例分析

小編給大家分享一下微信小程序中全局配置開發的示例分析，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！

創新互聯為您提適合企業的網站設計?讓您的網站在搜索引擎具有高度排名，讓您的網站具備超強的網絡競爭力！結合企業自身，進行網站設計及把握，最后結合企業文化和具體宗旨等，才能創作出一份性化解決方案。從網站策劃到成都網站設計、網站建設，我們的網頁設計師為您提供的解決方案。

本文主要和大家分享微信小程序全局配置開發實例，主要以代碼的形式和大家分享，希望能幫助到大家。

一.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
}

微信小程序中全局配置開發的示例分析