官方文檔
https://uniapp.dcloud.io/collocation/pages
一些配置項是全局的，也可以在頁面對象中設置
{
"pages": [ //pages數組中第一項表示應用啟動頁，參考：https://uniapp.dcloud.io/collocation/pages
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "uni-app",
"app-plus": {
/*
下拉刷新
在 App 平台下可以自定義部分下拉刷新的配置 page->app-plus->pullToRefresh。
support Boolean false 是否開啟窗口的下拉刷新功能
color String #2BD009 顏色值格式為"#RRGGBB"，僅"circle"樣式下拉刷新支持此屬性。
style String Android 平台為 circle；iOS 平台為 default。 可取值："default"——經典下拉刷新樣式（下拉拖動時頁面內容跟隨）；"circle"——圓圈樣式下拉刷新控件樣式（下拉拖動時僅刷新控件跟隨）。
height String 窗口的下拉刷新控件進入刷新狀態的拉拽高度。支持百分比，如"10%"；像素值，如"50px"，不支持rpx。
range String 窗口可下拉拖拽的范圍。支持百分比，如"10%"；像素值，如"50px"，不支持rpx。
offset String 0px 下拉刷新控件的起始位置。僅對"circle"樣式下拉刷新控件有效，用於定義刷新控件下拉時的起始位置。支持百分比，如"10%"；像素值，如"50px"，不支持rpx。如使用了非原生title且需要原生下拉刷新，一般都使用circle方式並將offset調至自定義title的高度
contentdown Object 目前支持一個屬性：caption——在下拉可刷新狀態時下拉刷新控件上顯示的標題內容。僅對"default"樣式下拉刷新控件有效。
contentover Object 目前支持一個屬性：caption——在釋放可刷新狀態時下拉刷新控件上顯示的標題內容。僅對"default"樣式下拉刷新控件有效。
contentrefresh Object 目前支持一個屬性：caption——在正在刷新狀態時下拉刷新控件上顯示的標題內容。僅對"default"樣式下拉刷新控件有效。
下拉刷新使用注意
enablePullDownRefresh 與 pullToRefresh->support 同時設置時，后者優先級較高。
如果期望在 App 和小程序上均開啟下拉刷新的話，請配置頁面的 enablePullDownRefresh 屬性為 true。
若僅期望在 App 上開啟下拉刷新，則不要配置頁面的 enablePullDownRefresh 屬性，而是配置 pullToRefresh->support 為 true。
開啟原生下拉刷新時，頁面里不應該使用全屏高的scroll-view，向下拖動內容時，會優先觸發下拉刷新而不是scroll-view滾動
原生下拉刷新的起始位置在原生導航欄的下方，如果取消原生導航欄，使用自定義導航欄，原生下拉刷新的位置會在屏幕頂部。如果希望在自定義導航欄下方拉動，只能使用circle方式的下拉刷新，並設置offset參數，將circle圈的起始位置調整到自定義導航欄下方。hello uni-app的擴展組件中有示例。
如果想在app端實現更多復雜的下拉刷新，比如美團、京東App那種拉下一個特殊圖形，可以使用nvue的組件。HBuilderX 2.0.3+起，新建項目選擇新聞模板可以體驗
如果想在vue頁面通過web前端技術實現下拉刷新，插件市場有例子，但前端下拉刷新的性能不如原生，復雜長列表會很卡
iOS上，default模式的下拉刷新和bounce回彈是綁定的，如果設置了bounce:none，會導致無法使用default下拉刷新
{
"pages": [
{
"path": "pages/index/index", //首頁
"style": {
"app-plus": {
"pullToRefresh": {
"support": true,
"color": "#ff3333",
"style": "default",
"contentdown": {
"caption": "下拉可刷新自定義文本"
},
"contentover": {
"caption": "釋放可刷新自定義文本"
},
"contentrefresh": {
"caption": "正在刷新自定義文本"
}
}
}
}
}
]
}
*/
"pullToRefresh": {
},
/*
titleNView 導航欄
屬性 類型 默認值 描述 版本兼容性
backgroundColor String #F7F7F7 背景顏色，顏色值格式為"#RRGGBB"。在使用半透明標題欄時，也可以設置rgba格式
buttons Array 自定義按鈕，詳見 buttons 純nvue即render:native時暫不支持
titleColor String #000000 標題文字顏色
titleOverflow String ellipsis 標題文字超出顯示區域時處理方式。"clip"-超出顯示區域時內容裁剪；"ellipsis"-超出顯示區域時尾部顯示省略標記（...）。
titleText String 標題文字內容
titleSize String 標題文字字體大小
type String default 導航欄樣式。"default"-默認樣式；"transparent"-滾動透明漸變；"float"-懸浮導航欄。 App-nvue 2.4.4+ 支持
tags Array 原生 View 增強，詳見：5+ View 控件
searchInput Object 原生導航欄上的搜索框配置，詳見：searchInput 1.6.0
homeButton Boolean false 標題欄控件是否顯示Home按鈕
autoBackButton Boolean true 標題欄控件是否顯示左側返回按鈕 2.6.3
backButton Object 返回按鈕的樣式，詳見：backButton 2.6.3 https://uniapp.dcloud.io/collocation/pages?id=app-titlenview-backbuttonstyles
backgroundImage String 支持以下類型： 背景圖片路徑 - 如"/static/img.png"，僅支持本地文件絕對路徑，根據實際標題欄寬高拉伸繪制； 漸變色 - 僅支持線性漸變，兩種顏色的漸變，如“linear-gradient(to top, #a80077, #66ff00)”， 其中第一個參數為漸變方向，可取值： "to right"表示從左向右漸變， “to left"表示從右向左漸變， “to bottom"表示從上到下漸變， “to top"表示從下到上漸變， “to bottom right"表示從左上角到右下角， “to top left"表示從右下角到左上角 2.6.3
backgroundRepeat String 僅在backgroundImage設置為圖片路徑時有效。 可取值： "repeat" - 背景圖片在垂直方向和水平方向平鋪； "repeat-x" - 背景圖片在水平方向平鋪，垂直方向拉伸； “repeat-y” - 背景圖片在垂直方向平鋪，水平方向拉伸； “no-repeat” - 背景圖片在垂直方向和水平方向都拉伸。 默認使用 “no-repeat" 2.6.3
titleAlign String "auto" 可取值： "center"-居中對齊； "left"-居左對齊； "auto"-根據平台自動選擇（Android平台居左對齊，iOS平台居中對齊） 2.6.3
blurEffect String "none" 此效果將會高斯模糊顯示標題欄后的內容，僅在type為"transparent"或"float"時有效。 可取值： "dark" - 暗風格模糊，對應iOS原生UIBlurEffectStyleDark效果； "extralight" - 高亮風格模糊，對應iOS原生UIBlurEffectStyleExtraLight效果； "light" - 亮風格模糊，對應iOS原生UIBlurEffectStyleLight效果； "none" - 無模糊效果。 注意：使用模糊效果時應避免設置背景顏色，設置背景顏色可能覆蓋模糊效果。 2.4.3
coverage String "132px" 標題欄控件變化作用范圍，僅在type值為transparent時有效，頁面滾動時標題欄背景透明度將發生變化。 當頁面滾動到指定偏移量時標題欄背景變為完全不透明。 支持百分比、像素值
splitLine Boolean false 標題欄的底部分割線(SplitLineStyles)，設置此屬性則在標題欄控件的底部顯示分割線，可配置顏色值及高度。 設置此屬性值為undefined或null則隱藏分割線。 默認不顯示底部分割線 2.6.6
subtitleColor String 副標題文字顏色，顏色值格式為"#RRGGBB"和"rgba(R,G,B,A)"，如"#FF0000"表示標題文字顏色為紅色。 默認值與主標題文字顏色一致 2.6.6
subtitleSize String "auto" 副標題文字字體大小，字體大小單位為像素，如"14px"表示字體大小為14像素，默認值為12像素。 2.6.6
subtitleOverflow String "ellipsis" 標題文字超出顯示區域時處理方式，可取值： "clip" - 超出顯示區域時內容裁剪； "ellipsis" - 超出顯示區域時尾部顯示省略標記（...）。 2.6.6
subtitleText String 副標題文字內容，設置副標后將顯示兩行標題，副標顯示在主標題（titleText）下方。 注意：設置副標題后將居左顯示 2.6.6
titleIcon String 標題圖標，圖標路徑如"./img/t.png"，僅支持本地文件路徑， 相對路徑，相對於當前頁面的host位置，固定寬高為邏輯像素值"34px"。 要求圖片的寬高相同。 注意：設置標題圖標后標題將居左顯示。 2.6.6
titleIconRadius String 無圓角 標題圖標圓角，取值格式為"XXpx"，其中XX為像素值（邏輯像素），如"10px"表示10像素半徑圓角。 2.6.6
Tips
頁面支持通過配置 navigationStyle為custom，或titleNView為false，來禁用原生導航欄。
一旦禁用原生導航，請注意閱讀自定義導航注意事項。
https://uniapp.dcloud.io/collocation/pages?id=customnav
titleNView 的 type 值為 transparent 時，導航欄為滾動透明漸變導航欄，默認只有button，滾動后標題欄底色和title文字會漸變出現； type 為 float 時，導航欄為懸浮標題欄，此時頁面內容上頂到了屏幕頂部，包括狀態欄，但導航欄懸浮蓋在頁面上方，一般這種場景會同時設置導航欄的背景色為rgba半透明顏色。
titleNView 的 type 值為 transparent 時，App-nvue 2.4.4+ 支持
在 titleNView 配置 buttons 后，監聽按鈕的點擊事件，vue 頁面及 nvue 的weex編譯模式參考：uni.onNavigationBarButtonTap
https://uniapp.dcloud.io/nvue-outline?id=onnavigationbarbuttontap
在 titleNView 配置 searchInput 后，相關的事件監聽參考：onNavigationBarSearchInputChanged 等
https://uniapp.dcloud.io/collocation/frame/lifecycle?id=%e9%a1%b5%e9%9d%a2%e7%94%9f%e5%91%bd%e5%91%a8%e6%9c%9f
可通過 [<navigation-bar>(/component/navigation-bar)] 配置
App下原生導航欄的按鈕如果使用字體圖標，注意檢查字體庫的名字（font-family）是否使用了默認的 iconfont，這個名字是保留字，不能作為外部引入的字體庫的名字，需要調整為自定義的名稱，否則無法顯示。
想了解各種導航欄的開發方法，請詳讀導航欄開發指南
https://ask.dcloud.net.cn/article/34921
Tips
buttons 的 text 推薦使用字體圖標。如果使用了漢字或英文，推薦把字體改小一點，否則文字長度增加后，距離屏幕右邊距太近。
App平台，buttons動態修改，詳見
App平台，buttons角標動態修改，見 hello uni-app 中模板-頂部導航標題欄-導航欄帶紅點和角標
App平台，設置searchInput的文字動態修改，API見文檔。注意disable狀態無法設置文字、placehold暫不支持動態設置
H5平台，如需實現上述動態修改，需在條件編譯通過dom操作修改
*/
"titleNView": {
/*
SplitLineStyles
屬性 類型 默認值 描述 版本兼容性
color String #CCCCCC 底部分割線顏色，可取值： "#RRGGBB"格式字符串，如"#FF0000"表示繪制紅色分割線； "rgba(R,G,B,A)"，其中R/G/B分別代表紅色值/綠色值/藍色值，正整數類型，取值范圍為0-255，A為透明度，浮點數類型，取值范圍為0-1（0為全透明，1為不透明），如"rgba(255,0,0,0.5)"，表示紅色半透明
height String "1px" 可取值：像素值（邏輯像素），支持小數點，如"1px"表示1像素高；百分比，如"1%"，相對於標題欄控件的高度。
*/
// "splitLine" : {
// "color":"#d8d8d8",
// "height" : "1px"
// },
// "type": "transparent",//透明漸變導航欄 App-nvue 2.4.4+ 支持
// "searchInput": {
// "backgroundColor": "#fff",
// "borderRadius": "6px", //輸入框圓角
// "placeholder": "請輸入搜索內容",
// "disabled": true //disable時點擊輸入框不置焦，可以跳到新頁面搜索
// },
/*
buttons 自定義按鈕
type String none 按鈕樣式，可取值見：buttons 樣式
color String 默認與標題文字顏色一致 按鈕上文字顏色
background String 默認值為灰色半透明 按鈕的背景顏色，僅在標題欄type=transparent時生效
colorPressed String 默認值為 color 屬性值自動調整透明度為 0.3 按下狀態按鈕文字顏色
float String right 按鈕在標題欄上的顯示位置，可取值"left"、"right"
fontWeight String normal 按鈕上文字的粗細。可取值"normal"-標准字體、"bold"-加粗字體。
fontSize String 按鈕上文字大小
fontSrc String 按鈕上文字使用的字體文件路徑。不支持網絡地址，請統一使用本地地址。
select String false 是否顯示選擇指示圖標（向下箭頭），常用於城市選擇
text String 按鈕上顯示的文字。使用字體圖標時 unicode 字符表示必須 '\u' 開頭，如 "\ue123"（注意不能寫成"\e123"）。
width String 44px 按鈕的寬度，可取值： "*px" - 邏輯像素值，如"10px"表示10邏輯像素值，不支持rpx。按鈕的內容居中顯示； "auto" - 自定計算寬度，根據內容自動調整按鈕寬度
自定義返回按鈕的樣式
當autoBackButton設置為true時生效。 通過此屬性可自定義返回按鈕樣式，如圖標大小、紅點、角標、標題等。
*/
"buttons" : [
/*
forward 前進按鈕
back 后退按鈕
share 分享按鈕
favorite 收藏按鈕
home 主頁按鈕
menu 菜單按鈕
close 關閉按鈕
none 無樣式，需通過 text 屬性設置按鈕上顯示的內容、通過 fontSrc 屬性設置使用的字體庫。
*/
{"type" : "none"}
],
/* 此屬性可自定義返回按鈕樣式，如圖標大小、紅點、角標、標題等。true 生效 */
"autoBackButton": false,
/*
backButton 返回按鈕樣式
background String none 背景顏色，僅在標題欄type=transparent時生效，當標題欄透明時按鈕顯示的背景顏色。 可取值#RRGGBB和rgba格式顏色字符串，默認值為灰色半透明。
badgeText String 角標文本，最多顯示3個字符，超過則顯示為...
color String 窗口標題欄控件的標題文字顏色。 圖標和標題顏色，可取值： "#RRGGBB"格式字符串，如"#FF0000"表示紅色； "rgba(R,G,B,A)"，其中R/G/B分別代表紅色值/綠色值/藍色值，正整數類型，取值范圍為0-255，A為透明度，浮點數類型，取值范圍為0-1（0為全透明，1為不透明），如"rgba(255,0,0,0.5)"，表示紅色半透明。
colorPressed String 按下狀態按鈕文字顏色，可取值： "#RRGGBB"格式字符串，如"#FF0000"表示紅色； "rgba(R,G,B,A)"，其中R/G/B分別代表紅色值/綠色值/藍色值，正整數類型，取值范圍為0-255，A為透明度，浮點數類型，取值范圍為0-1（0為全透明，1為不透明），如"rgba(255,0,0,0.5)"，表示紅色半透明。 默認值為color屬性值自動調整透明度為0.3。
fontWeight String "normal" 返回圖標的粗細，可取值： "normal" - 標准字體； "bold" - 加粗字體。
fontSize String 返回圖標文字大小，可取值：字體高度像素值，數字加"px"格式字符串，如"22px"。 窗口標題欄為透明樣式（type="transparent"）時，默認值為"22px"； 窗口標題欄為默認樣式（type="default"）時，默認值為"27px"。
redDot Boolean false 是否顯示紅點，設置為true則顯示紅點，false則不顯示紅點。默認值為false。 注意：當設置了角標文本時紅點不顯示。
title String 返回按鈕上的標題，顯示在返回圖標（字體圖標）后，默認為空字符串。
ftitleWeight String "normal" 返回按鈕上標題的粗細，可取值： "normal" - 標准字體； "bold" - 加粗字體。
fontSize String "16px" 標題的字體大小，可取值：字體高度像素值，數字加"px"格式字符串，如"22px"。
*/
"backButton" : {
},
/*
searchInput 搜索框配置
可以在titleNView的原生導航欄上放置搜索框。其寬度根據周圍元素自適應。
autoFocus Boolean false 是否自動獲取焦點
align String center 非輸入狀態下文本的對齊方式。可取值： "left" - 居左對齊； "right" - 居右對齊； "center" - 居中對齊。
backgroundColor String rgba(255,255,255,0.5) 背景顏色
borderRadius String 0px 輸入框的圓角半徑，取值格式為"XXpx"，其中XX為像素值（邏輯像素），不支持rpx。
placeholder String 提示文本。
placeholderColor String #CCCCCC 提示文本顏色
disabled Boolean false 是否可輸入
Tips
searchInput的點擊輸入框onNavigationBarSearchInputClicked、文本變化onNavigationBarSearchInputChanged、點擊搜索按鈕onNavigationBarSearchInputConfirmed等生命周期，見文檔頁面生命周期。
在生命周期里通過參數e.text，可獲取輸入框內容。具體見hello uni-app中模板-頂部導航欄中的示例
如需動態修改searchInput，或者獲取searchInput的placehold，參考uni-app動態修改App端導航欄 https://ask.dcloud.net.cn/article/35374
*/
"searchInput": {
},
/*
原生子窗體
subNVues 是 vue 頁面的原生子窗體。
用於解決App中 vue 頁面中的層級覆蓋和原生界面靈活自定義用的。
它不是全屏頁面，也不是組件，就是一個原生子窗體。它是一個 nvue 頁面，使用 weex 引擎渲染，提供了比 cover-view、plus.nativeObj.view 更強大的原生排版能力，方便自定義原生導航或覆蓋原生地圖、視頻等。
請詳讀subNVues 開發指南 https://ask.dcloud.net.cn/article/35948
subNVue 也可以在 nvue 頁面中使用。但目前在純nvue下（render為native）還不支持。
屬性 類型 描述
id String subNVue 原生子窗體的標識
path String 配置 nvue 文件路徑，nvue 文件需放置到使用 subNvue 的頁面文件目錄下
type String 原生子窗口內置樣式，可取值：'popup',彈出層；"navigationBar",導航欄
style Object subNVue 原生子窗體的樣式，配置項參考下方 subNVuesStyle https://uniapp.dcloud.io/collocation/pages?id=app-subnvuesstyle
*/
"subNVues": [
// 側滑菜單 子窗體配置？？
// {
// "id" : "自定義標識，必須唯一",
// "path" : "子頁面路徑 pages/index/drawer.nvue",
// "type" : "popup",
/*
position String absolute 原生子窗體的排版位置，排版位置決定原生子窗體在父窗口中的定位方式。 可取值："static"，原生子窗體在頁面中正常定位，如果頁面存在滾動條則隨窗口內容滾動；"absolute"，原生子窗體在頁面中絕對定位，如果頁面存在滾動條不隨窗口內容滾動；"dock"，原生子窗體在頁面中停靠，停靠的位置由dock屬性值決定。 默認值為"absolute"。
dock String bottom 原生子窗體的停靠方式,僅當原生子窗體 "position" 屬性值設置為 "dock" 時才生效，可取值："top"，原生子窗體停靠則頁面頂部；"bottom"，原生子窗體停靠在頁面底部；"right"，原生子窗體停靠在頁面右側；"left"，原生子窗體停靠在頁面左側。 默認值為"bottom"。
mask HexColor rgba(0,0,0,0.5) 原生子窗體的遮罩層,僅當原生子窗體 "type" 屬性值設置為 "popup" 時才生效，可取值： rgba格式字符串，定義純色遮罩層樣式，如"rgba(0,0,0,0.5)"，表示黑色半透明；
width String 100% 原生子窗體的寬度,支持百分比、像素值，默認為100%。未設置width屬性值時，可同時設置left和right屬性值改變窗口的默認寬度。
height String 100% 原生子窗體的高度,支持百分比、像素值，默認為100%。 當未設置height屬性值時，優先通過top和bottom屬性值來計算原生子窗體的高度。
top String 0px 原生子窗體垂直向下的偏移量，支持百分比、像素值，默認值為0px。 未設置top屬性值時，優先通過bottom和height屬性值來計算原生子窗體的top位置。
bottom String 原生子窗體垂直向上偏移量,支持百分比、像素值，默認值無值（根據top和height屬性值來自動計算）。 當同時設置了top和height值時，忽略此屬性值； 當未設置height值時，可通過top和bottom屬性值來確定原生子窗體的高度。
left String 0px 原生子窗體水平向左的偏移量，支持百分比、像素值，默認值為0px。 未設置left屬性值時，優先通過right和width屬性值來計算原生子窗體的left位置。
right String 原生子窗體水平向右的偏移量，支持百分比、像素值，默認無值（根據left和width屬性值來自動計算）。 當設置了left和width值時，忽略此屬性值； 當未設置width值時，可通過left和bottom屬性值來確定原生子窗體的寬度。
margin String 原生子窗體的邊距，用於定位原生子窗體的位置，支持auto，auto表示居中。若設置了left、right、top、bottom則對應的邊距值失效。
zindex Number 原生子窗體的窗口的堆疊順序值，擁有更高堆疊順序的窗口總是會處於堆疊順序較低的窗口的前面，擁有相同堆疊順序的窗口后調用show方法則在前面。
background String #FFFFFF 窗口的背景顏色,Android平台4.0以上系統才支持“transparent”背景透明樣式。比如subnvue為圓角時需要設置為transparent才能看到正確的效果
*/
// "style" : {
// }
// }
]
}
}
}
}
],
"globalStyle": {
/* navigationBarBackgroundColor HexColor #F7F7F7 導航欄背景顏色（同狀態欄背景色） APP與H5為#F7F7F7，小程序平台請參考相應小程序文檔 */
"navigationBarBackgroundColor": "#F8F8F8",
/* navigationBarTextStyle String white 導航欄標題顏色及狀態欄前景顏色，僅支持 black/white */
"navigationBarTextStyle": "black",
/* navigationBarTitleText String 導航欄標題文字內容 */
"navigationBarTitleText": "uni-app",
/*
navigationStyle String default 導航欄樣式，僅支持 default/custom。
custom即取消默認的原生導航欄，需看使用注意
微信小程序 7.0+、百度小程序、H5、App（2.0.3+）
https://uniapp.dcloud.io/collocation/pages?id=customnav
*/
"navigationStyle" : "default",
/* backgroundColor HexColor #ffffff 下拉顯示出來的窗口的背景色 微信小程序 */
"backgroundColor": "#F8F8F8",
/* backgroundTextStyle String dark 下拉 loading 的樣式，僅支持 dark / light 微信小程序 */
"backgroundTextStyle" : "dark",
/*
enablePullDownRefresh
Boolean false
是否開啟下拉刷新，詳見頁面生命周期。
https://uniapp.dcloud.io/collocation/frame/lifecycle?id=%e9%a1%b5%e9%9d%a2%e7%94%9f%e5%91%bd%e5%91%a8%e6%9c%9f
*/
"enablePullDownRefresh" : false,
/*
onReachBottomDistance
Number 50
頁面上拉觸底事件觸發時距頁面底部距離，單位只支持px，
詳見頁面生命周期
https://uniapp.dcloud.io/collocation/frame/lifecycle?id=%e9%a1%b5%e9%9d%a2%e7%94%9f%e5%91%bd%e5%91%a8%e6%9c%9f
*/
"onReachBottomDistance" : 50,
/*
backgroundColorTop
HexColor #ffffff 頂部窗口的背景色（bounce回彈區域）
僅 iOS 平台
*/
"backgroundColorTop" : "#ffffff",
/*
backgroundColorBottom
HexColor #ffffff
底部窗口的背景色（bounce回彈區域） 僅 iOS 平台
*/
"backgroundColorBottom" : "#ffffff",
/*
titleImage String
導航欄圖片地址（替換當前文字標題），
支付寶小程序內必須使用https的圖片鏈接地址 支付寶小程序、H5、APP
*/
"titleImage" : "./static/logo.png",
/*
transparentTitle
String none
導航欄整體（前景、背景）透明設置。支持
always 一直透明 / auto 滑動自適應 / none 不透明
支付寶小程序、H5、APP
*/
"transparentTitle" : "auto",
/*
titlePenetrate
String NO
導航欄點擊穿透
支付寶小程序、H5
*/
"titlePenetrate" : "NO",
/*
pageOrientation
String portrait
橫屏配置，屏幕旋轉設置，
僅支持 auto / portrait / landscape
詳見 響應顯示區域變化
App 2.4.7+、微信小程序
https://developers.weixin.qq.com/miniprogram/dev/framework/view/resizable.html
*/
"pageOrientation" : "auto",
/*
animationType
String pop-in
窗口顯示的動畫效果，詳見：窗口動畫 App
https://uniapp.dcloud.io/api/router?id=animation
*/
"animationType" : "pop-in",
/*
animationDuration
Number 300
窗口顯示動畫的持續時間，單位為 ms
App
*/
"animationDuration" : 450,
/*
app-plus
Object
設置編譯到 App 平台的特定樣式，配置項參考下方
https://uniapp.dcloud.io/collocation/pages?id=app-plus
配置編譯到 App 平台時的特定樣式，部分常用配置 H5 平台也支持。以下僅列出常用，更多配置項參考
https://www.html5plus.org/doc/zh_cn/webview.html#plus.webview.WebviewStyles
background HexColor #FFFFFF 窗體背景色。無論vue頁面還是nvue頁面，在App上都有一個父級原生窗體，該窗體的背景色生效時間快於頁面里的css生效時間 App
titleNView Object 導航欄 ，詳見:導航欄 App、H5
subNVues Object 原生子窗體，詳見:原生子窗體 App 1.9.10+
bounce String 頁面回彈效果，設置為 "none" 時關閉效果。 App（nvue Android無頁面級bounce效果，僅list、recycle-list、waterfall等滾動組件有bounce效果）
popGesture String close 側滑返回功能，可選值："close"（啟用側滑返回）、"none"（禁用側滑返回） App-iOS
softinputNavBar String auto iOS軟鍵盤上完成工具欄的顯示模式，設置為 "none" 時關閉工具欄。 App-iOS
softinputMode String adjustPan 軟鍵盤彈出模式，支持 adjustResize、adjustPan 兩種模式 App
pullToRefresh Object 下拉刷新 App
scrollIndicator String 滾動條顯示策略，設置為 "none" 時不顯示滾動條。 App
animationType String pop-in 窗口顯示的動畫效果，詳見：窗口動畫。 App
animationDuration Number 300 窗口顯示動畫的持續時間，單位為 ms。 App
.nvue 頁面僅支持 titleNView、pullToRefresh、scrollIndicator 配置，其它配置項暫不支持
*/
"app-plus" : {
},
/*
h5
Object
設置編譯到 H5 平台的特定樣式，配置項參考下方
https://uniapp.dcloud.io/collocation/pages?id=h5
titleNView Object 導航欄
pullToRefresh Object 下拉刷新
注意事項：
如果 h5 節點沒有配置，默認會使用 app-plus 下的配置。
配置了 h5 節點，則會覆蓋 app-plus 下的配置
*/
"h5" : {
/*
backgroundColor String #F7F7F7 背景顏色，顏色值格式為"#RRGGBB"。
buttons Array 自定義按鈕，參考 buttons https://uniapp.dcloud.io/collocation/pages?id=h5-titlenview-buttons
titleColor String #000000 標題文字顏色
titleText String 標題文字內容
titleSize String 標題文字字體大小
type String default 導航欄樣式。"default"-默認樣式；"transparent"-透明漸變。
searchInput Object 導航欄上的搜索框樣式，詳見：searchInput 1.6.5 https://uniapp.dcloud.io/collocation/pages?id=h5-searchinput
*/
"titleNView": {
/*
type String none 按鈕樣式，可取值見：buttons 樣式
color String 默認與標題文字顏色一致 按鈕上文字顏色
background String 默認值為灰色半透明 按鈕的背景顏色，僅在標題欄type=transparent時生效
badgeText String 按鈕上顯示的角標文本，最多顯示3個字符，超過則顯示為...
colorPressed（暫不支持） String 默認值為 color 屬性值自動調整透明度為 0.3 按下狀態按鈕文字顏色
float String right 按鈕在標題欄上的顯示位置，可取值"left"、"right"
fontWeight String normal 按鈕上文字的粗細。可取值"normal"-標准字體、"bold"-加粗字體。
fontSize String 按鈕上文字大小
fontSrc String 按鈕上文字使用的字體文件路徑。
select String false 是否顯示選擇指示圖標（向下箭頭）
text String 按鈕上顯示的文字。使用字體圖標時 unicode 字符表示必須 '\u' 開頭，如 "\ue123"（注意不能寫成"\e123"）。
width String 44px 按鈕的寬度，可取值： "*px" - 邏輯像素值，如"10px"表示10邏輯像素值，不支持rpx，按鈕的內容居中顯示； "auto" - 自定計算寬度，根據內容自動調整按鈕寬度
*/
"buttons": {
/*
forward 前進按鈕
back 后退按鈕
share 分享按鈕
favorite 收藏按鈕
home 主頁按鈕
menu 菜單按鈕
close 關閉按鈕
none 無樣式，需通過 text 屬性設置按鈕上顯示的內容、通過 fontSrc 屬性設置使用的字體庫。
*/
"type" : "none"
},
/*
autoFocus Boolean false 是否自動獲取焦點
align String center 非輸入狀態下文本的對齊方式。可取值： "left" - 居左對齊； "right" - 居右對齊； "center" - 居中對齊。
backgroundColor String rgba(255,255,255,0.5) 背景顏色
borderRadius String 0px 輸入框的圓角半徑，取值格式為"XXpx"，其中XX為像素值（邏輯像素），不支持rpx。
placeholder String 提示文本
placeholderColor String #CCCCCC 提示文本顏色
disabled Boolean false 是否可輸入
*/
"searchInput" : {
}
},
/*
color String #2BD009 顏色值格式為"#RRGGBB"
offset String 0px 下拉刷新控件的起始位置。支持百分比，如"10%"；像素值，如"50px"，不支持rpx。
*/
"pullToRefresh": {
}
},
/*
mp-alipay
Object
設置編譯到 mp-alipay 平台的特定樣式，配置項參考下方
MP-ALIPAY
https://uniapp.dcloud.io/collocation/pages?id=mp-alipay
allowsBounceVertical String YES 是否允許向下拉拽。支持 YES / NO
titleImage String 導航欄圖片地址（替換當前文字標題），內必須使用https的圖片鏈接地址
transparentTitle String none 導航欄透明設置。支持 always 一直透明 / auto 滑動自適應 / none 不透明
titlePenetrate String NO 導航欄點擊穿透
showTitleLoading String NO 是否進入時顯示導航欄的 loading。支持 YES / NO
backgroundImageUrl String 下拉露出顯示的背景圖鏈接
backgroundImageColor HexColor 下拉露出顯示的背景圖底色
gestureBack String NO iOS 用，是否支持手勢返回。支持 YES / NO
enableScrollBar String YES Android 用，是否顯示 WebView 滾動條。支持 YES / NO
*/
"MP-ALIPAY" : {
},
/*
mp-weixin
Object
設置編譯到 mp-weixin 平台的特定樣式
微信小程序
*/
"mp-weixin" : {
},
/*
mp-baidu
Object
設置編譯到 mp-baidu 平台的特定樣式
百度小程序
*/
"mp-baidu" : {
},
/*
mp-toutiao
Object
設置編譯到 mp-toutiao 平台的特定樣式
字節跳動小程序
*/
"mp-toutiao" : {
},
/*
mp-qq
Object
設置編譯到 mp-qq 平台的特定樣式
QQ小程序
*/
"mp-qq" : {
},
/*
mp-kuaishou
Object
設置編譯到 mp-kuaishou 平台的特定樣式
快手小程序
*/
"mp-kuaishou" : {
},
/*
usingComponents
Object
引用小程序組件，參考 小程序組件
https://uniapp.dcloud.io/frame?id=%e5%b0%8f%e7%a8%8b%e5%ba%8f%e7%bb%84%e4%bb%b6%e6%94%af%e6%8c%81
*/
"usingComponents" : {
},
/*
leftWindow
Boolean true
當存在 leftWindow時，當前頁面是否顯示 leftWindow
H5
*/
"leftWindow" : true,
/*
topWindow
Boolean true
當存在 topWindow 時，當前頁面是否顯示 topWindow
H5
*/
"topWindow" : true,
/*
rightWindow
Boolean true
當存在 rightWindow 時，當前頁面是否顯示 rightWindow
H5
*/
"rightWindow" : true
/*
maxWidth
Number
單位px，當瀏覽器可見區域寬度大於maxWidth時，兩側留白，
當小於等於maxWidth時，頁面鋪滿；
不同頁面支持配置不同的maxWidth；
maxWidth = leftWindow(可選)+page(頁面主體)+rightWindow(可選)
使用 maxWidth 時，頁面內fixed元素需要使用--window-left,--window-right來保證布局位置正確
H5（2.9.9+）
*/
/* "maxWidth" : "1280px" */
},
/*
HBuilderX 2.5.5起支持easycom組件模式。
傳統vue組件，需要安裝、引用、注冊，三個步驟后才能使用組件。
easycom將其精簡為一步。 只要組件安裝在項目的components目錄下，並符合components/組件名稱/組件名稱.vue目錄結構。
就可以不用引用、注冊，直接在頁面中使用。
如下：
<template>
<view class="container">
<uni-list>
<uni-list-item title="第一行"></uni-list-item>
<uni-list-item title="第二行"></uni-list-item>
</uni-list>
</view>
</template>
<script>
// 這里不用import引入，也不需要在components內注冊uni-list組件。template里就可以直接用
export default {
data() {
return {
}
}
}
</script>
不管components目錄下安裝了多少組件，easycom打包后會自動剔除沒有使用的組件，對組件庫的使用尤為友好。
組件庫批量安裝，隨意使用，自動按需打包。
以官方的uni-ui為例，在HBuilderX新建項目界面選擇uni-ui項目模板，只需在頁面中敲u，拉出大量組件代碼塊，直接選擇，即可使用。大幅提升開發效率，降低使用門檻。
在uni-app插件市場下載符合components/組件名稱/組件名稱.vue目錄結構的組件，均可直接使用。
easycom是自動開啟的，不需要手動開啟，有需求時可以在pages.json的easycom節點進行個性化設置，如關閉自動掃描，或自定義掃描匹配組件的策略。
設置參數如下：
autoscan Boolean true 是否開啟自動掃描，開啟后將會自動掃描符合components/組件名稱/組件名稱.vue目錄結構的組件
custom Object - 以正則方式自定義組件匹配規則。如果autoscan不能滿足需求，可以使用custom自定義匹配規則
自定義easycom配置的示例
如果需要匹配node_modules內的vue文件，需要使用packageName/path/to/vue-file-$1.vue形式的匹配規則，其中packageName為安裝的包名，/path/to/vue-file-$1.vue為vue文件在包內的路徑。
"easycom": {
"autoscan": true,
"custom": {
"^uni-(.*)": "@/components/uni-$1.vue", // 匹配components目錄內的vue文件
"^vue-file-(.*)": "packageName/path/to/vue-file-$1.vue" // 匹配node_modules內的vue文件
}
}
說明
easycom方式引入的組件無需在頁面內import，也不需要在components內聲明，即可在任意頁面使用
easycom方式引入組件不是全局引入，而是局部引入。例如在H5端只有加載相應頁面才會加載使用的組件
在組件名完全一致的情況下，easycom引入的優先級低於手動引入（區分連字符形式與駝峰形式）
考慮到編譯速度，直接在pages.json內修改easycom不會觸發重新編譯，需要改動頁面內容觸發。
easycom只處理vue組件，不處理小程序專用組件（如微信的wxml格式組件）。不處理后綴為.nvue的組件。但vue組件也可以全端運行，包括小程序和app-nvue。可以參考uni ui，使用vue后綴，同時兼容nvue頁面。
nvue頁面里引用.vue后綴的組件，會按照nvue方式使用原生渲染，其中不支持的css會被忽略掉。這種情況同樣支持easycom
*/
"easycom": {
"autoscan" : true
},
/*
tabBar 底部欄設置
如果應用是一個多 tab 應用，可以通過 tabBar 配置項指定一級導航欄，以及 tab 切換時顯示的對應頁。
在 pages.json 中提供 tabBar 配置，不僅僅是為了方便快速開發導航，更重要的是在App和小程序端提升性能。
在這兩個平台，底層原生引擎在啟動時無需等待js引擎初始化，即可直接讀取 pages.json 中配置的 tabBar 信息，渲染原生tab。
Tips
當設置 position 為 top 時，將不會顯示 icon
tabBar 中的 list 是一個數組，只能配置最少2個、最多5個 tab，tab 按數組的順序排序。
tabbar 切換第一次加載時可能渲染不及時，可以在每個tabbar頁面的onLoad生命周期里先彈出一個等待雪花（hello uni-app使用了此方式）
tabbar 的頁面展現過一次后就保留在內存中，再次切換 tabbar 頁面，只會觸發每個頁面的onShow，不會再觸發onLoad。
頂部的 tabbar 目前僅微信小程序上支持。需要用到頂部選項卡的話，建議不使用 tabbar 的頂部設置，而是自己做頂部選項卡，可參考 hello uni-app->模板->頂部選項卡。
color HexColor 是 tab 上的文字默認顏色
selectedColor HexColor 是 tab 上的文字選中時的顏色
backgroundColor HexColor 是 tab 的背景色
borderStyle String 否 black tabbar 上邊框的顏色，可選值 black/white App 2.3.4+ 支持其他顏色值、H5 3.0.0+
blurEffect String 否 none iOS 高斯模糊效果，可選值 dark/extralight/light/none（參考:使用說明） App 2.4.0+ 支持、H5 3.0.0+（只有最新版瀏覽器才支持）
list Array 是 tab 的列表，詳見 list 屬性說明，最少2個、最多5個 tab
position String 否 bottom 可選值 bottom、top top 值僅微信小程序支持
fontSize String 否 10px 文字默認大小 App 2.3.4+、H5 3.0.0+
iconWidth String 否 24px 圖標默認寬度（高度等比例縮放） App 2.3.4+、H5 3.0.0+
spacing String 否 3px 圖標和文字的間距 App 2.3.4+、H5 3.0.0+
height String 否 50px tabBar 默認高度 App 2.3.4+、H5 3.0.0+
midButton Object 否 中間按鈕 僅在 list 項為偶數時有效 App 2.3.4+、H5 3.0.0+
tabbar常見問題
tabbar 的 js api 見接口-界面-tabbar(https://uniapp.dcloud.io/api/ui/tabbar)，可實現動態顯示隱藏（如彈出層無法覆蓋tabbar）、內容修改（如國際化）、item加角標等功能。hello uni-app中也有示例。
tabbar 的 item 點擊事件見頁面生命周期的onTabItemTap(https://uniapp.dcloud.io/collocation/frame/lifecycle?id=%E9%A1%B5%E9%9D%A2%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F)。
代碼跳轉到 tabbar 頁面，api只能使用uni.switchTab(https://uniapp.dcloud.io/api/router?id=switchtab)，不能使用uni.navigateTo、uni.redirectTo；使用navigator組件跳轉時必須設置open-type="switchTab"(https://uniapp.dcloud.io/component/navigator)
tabbar 的默認高度，在不同平台不一樣。App端的默認高度在HBuilderX 2.3.4起從56px調整為50px，與H5端統一。開發者也可以自行設定高度，調回56px。詳見
tabbar 在H5端是div模擬的，屬於前端屏幕窗口的一部分，如果要使用bottom居底定位方式，應該使用css變量--window-bottom，比如懸浮在tabbar上方10px的按鈕，樣式如下bottom: calc(var(--window-bottom) + 10px)
中間帶+號的tabbar模板例子，參考(https://ext.dcloud.net.cn/plugin?id=98)。可跨端，但+號不凸起。如需中間凸起，配置tabbar的midButton。
如果是需要先登錄、后進入tab頁面，不需要把登錄頁設為首頁，首頁仍然是tabbar頁，可參考HBuilderX新建uni-app項目時的登錄模板
前端彈出遮罩層擋不住tabbar的問題，跨端處理方式時動態隱藏tabbar。App端可以使用plus.nativeObj.view或subNVue做彈出和遮罩，可參考這個底部原生圖標分享菜單例子(https://ext.dcloud.net.cn/plugin?id=69)
微信小程序模擬器1.02.1904090版有bug，在縮放模擬器頁面百分比后，tabbar點擊多次后就會卡死。真機無礙，使用時注意。詳見(https://developers.weixin.qq.com/community/develop/doc/0002e6e6bf0d602d8c783e10756400)
PC寬屏上，當頁面存在topWindow或leftWindow或rightWindow等多窗體結構時，tabBar自動隱藏（HBuilderX 2.9.9），請使用 custom-tab-bar(https://uniapp.dcloud.io/component/custom-tab-bar)組件 配置 tabBar 的位置。
代碼示例
"tabBar": {
"color": "#7A7E83",
"selectedColor": "#3cc51f",
"borderStyle": "black",
"backgroundColor": "#ffffff",
"list": [{
"pagePath": "pages/component/index",
"iconPath": "static/image/icon_component.png",
"selectedIconPath": "static/image/icon_component_HL.png",
"text": "組件"
}, {
"pagePath": "pages/API/index",
"iconPath": "static/image/icon_API.png",
"selectedIconPath": "static/image/icon_API_HL.png",
"text": "接口"
}]
}
自定義tabbar
原生tabBar是相對固定的配置方式，可能無法滿足所有場景，這就涉及到自定義tabBar。
但注意除了H5端，自定義tabBar的性能體驗會低於原生tabBar。App和小程序端非必要不要自定義。
H5端的自定義tabBar組件：H5端不存在原生tabBar性能更高的概念，並且寬屏下常見的tabBar在頂部而不是底部，此時可以使用 custom-tab-bar組件 來自定義
普通自定義tabBar：使用view自行繪制tabBar。如果頁面是多頁方式，切換tabBar將無法保持底部tabBar一直顯示。所以這種情況建議使用單頁方式。單頁方式，如果是復雜頁面，應用性能會下降明顯，需減少頁面復雜度。如果是App端，nvue單頁的性能會顯著高於vue頁面
微信小程序自定義tabbar：微信提供一直基於webview自定義tabBar的方案。該功能體驗不佳，不太推薦使用。如果要使用，參考微信文檔，項目根創建 custom-tab-bar 目錄，注意里邊的代碼是 wxml,wxss，不是 vue，uni-app編譯器會直接拷貝該目錄到微信小程序中
原生的tabbar有且只有一個且在首頁。二級頁如需的tab，需自行編寫view來實現。一般二級頁面更適合的導航是 segement組件
*/
"tabBar": {
/*
pagePath String 是 頁面路徑，必須在 pages 中先定義
text String 是 tab 上按鈕文字，在 App 和 H5 平台為非必填。例如中間可放一個沒有文字的+號圖標
iconPath String 否 圖片路徑，icon 大小限制為40kb，建議尺寸為 81px * 81px，當 position 為 top 時，此參數無效，不支持網絡圖片，不支持字體圖標
selectedIconPath String 否 選中時的圖片路徑，icon 大小限制為40kb，建議尺寸為 81px * 81px ，當 position 為 top 時，此參數無效
*/
"list": [],
/*
width String 否 80px 中間按鈕的寬度，tabBar 其它項為減去此寬度后平分，默認值為與其它項平分寬度
height String 否 50px 中間按鈕的高度，可以大於 tabBar 高度，達到中間凸起的效果
text String 否 中間按鈕的文字
iconPath String 否 中間按鈕的圖片路徑
iconWidth String 否 24px 圖片寬度（高度等比例縮放）
backgroundImage String 否 中間按鈕的背景圖片路徑
midButton沒有pagePath，需監聽點擊事件，自行處理點擊后的行為邏輯。監聽點擊事件為調用API：uni.onTabBarMidButtonTap，詳見https://uniapp.dcloud.io/api/ui/tabbar?id=ontabbarmidbuttontap
*/
"midButton": {
}
},
/*
啟動模式配置，僅開發期間生效，用於模擬直達頁面的場景，
如：小程序轉發后，用戶點擊所打開的頁面。
current Number 是 當前激活的模式，list節點的索引值
list Array 是 啟動模式列表
代碼示例：
"condition": { //模式配置，僅開發期間生效
"current": 0, //當前激活的模式（list 的索引項）
"list": [{
"name": "swiper", //模式名稱
"path": "pages/component/swiper/swiper", //啟動頁面，必選
"query": "interval=4000&autoplay=false" //啟動參數，在頁面的onLoad函數里面得到。
},
{
"name": "test",
"path": "pages/component/switch/switch"
}
]
}
*/
"condition" : {
/*
name String 是 啟動模式名稱
path String 是 啟動頁面路徑
query String 否 啟動參數，可在頁面的 onLoad 函數里獲得
注意： 在 App 里真機運行可直接打開配置的頁面，微信開發者工具里需要手動改變編譯模式，如下圖：
*/
"list": [
]
},
/*
subPackages
分包加載配置，此配置為小程序的分包加載機制。
因小程序有體積和資源加載限制，各家小程序平台提供了分包方式，優化小程序的下載和啟動速度。
所謂的主包，即放置默認啟動頁面/TabBar 頁面，以及一些所有分包都需用到公共資源/JS 腳本；而分包則是根據pages.json的配置進行划分。
在小程序啟動時，默認會下載主包並啟動主包內頁面，當用戶進入分包內某個頁面時，會把對應分包自動下載下來，下載完成后再進行展示。此時終端界面會有等待提示。
App默認為整包。從uni-app 2.7.12+ 開始，也兼容了小程序的分包配置。其目的不用於下載提速，而用於首頁是vue時的啟動提速。App下開啟分包，除在pages.json中配置分包規則外，還需要在manifest中設置在app端開啟分包設置，詳見：https://uniapp.dcloud.io/collocation/manifest?id=app-vue-optimization
subPackages 節點接收一個數組，數組每一項都是應用的子包，其屬性值如下：
root String 是 子包的根目錄
pages Array 是 子包由哪些頁面組成，參數同 pages https://uniapp.dcloud.io/collocation/pages?id=pages
注意：
subPackages 里的pages的路徑是 root 下的相對路徑，不是全路徑。
微信小程序每個分包的大小是2M，總體積一共不能超過20M。
百度小程序每個分包的大小是2M，總體積一共不能超過8M。
支付寶小程序每個分包的大小是2M，總體積一共不能超過4M。
QQ小程序每個分包的大小是2M，總體積一共不能超過24M。
字節小程序每個分包的大小是2M，總體積一共不能超過16M（字節小程序基礎庫 1.88.0 及以上版本開始支持，字節小程序開發者工具請使用大於等於 2.0.6 且小於 3.0.0 的版本）。
分包下支持獨立的 static 目錄，用來對靜態資源進行分包。
uni-app內支持對微信小程序、QQ小程序、百度小程序、支付寶小程序、字節小程序(HBuilderX 3.0.3+)分包優化，即將靜態資源或者js文件放入分包內不占用主包大小。詳情請參考：關於分包優化的說明
針對vendor.js過大的情況可以使用運行時壓縮代碼
HBuilderX創建的項目勾選運行-->運行到小程序模擬器-->運行時是否壓縮代碼
cli創建的項目可以在package.json中添加參數--minimize，示例："dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch --minimize"
使用方法：
假設支持分包的 uni-app 目錄結構如下：
┌─pages
│ ├─index
│ │ └─index.vue
│ └─login
│ └─login.vue
├─pagesA
│ ├─static
│ └─list
│ └─list.vue
├─pagesB
│ ├─static
│ └─detail
│ └─detail.vue
├─static
├─main.js
├─App.vue
├─manifest.json
└─pages.json
則需要在 pages.json 中填寫
{
"pages": [{
"path": "pages/index/index",
"style": { ...}
}, {
"path": "pages/login/login",
"style": { ...}
}],
"subPackages": [{
"root": "pagesA",
"pages": [{
"path": "list/list",
"style": { ...}
}]
}, {
"root": "pagesB",
"pages": [{
"path": "detail/detail",
"style": { ...}
}]
}],
"preloadRule": {
"pagesA/list/list": {
"network": "all",
"packages": ["__APP__"]
},
"pagesB/detail/detail": {
"network": "all",
"packages": ["pagesA"]
}
}
}
*/
"subPackages": {
},
/*
分包預載配置。
配置preloadRule后，在進入小程序某個頁面時，由框架自動預下載可能需要的分包，提升進入后續分包頁面時的啟動速度
preloadRule 中，key 是頁面路徑，value 是進入此頁面的預下載配置，每個配置有以下幾項：
字段 類型 必填 默認值 說明
packages StringArray 是 無 進入頁面后預下載分包的 root 或 name。__APP__ 表示主包。
network String 否 wifi 在指定網絡下預下載，可選值為：all（不限網絡）、wifi（僅wifi下預下載）
app的分包，同樣支持preloadRule，但網絡規則無效。
FAQ
Q：為什么在pages.json里配置小程序定位權限描述，無法編譯到小程序端，運行后一直提示getLocation需要在app.json中聲明
A：微信小程序的權限描述配置在manifest中，不在pages.json中，具體參考文檔：https://uniapp.dcloud.io/collocation/manifest?id=mp-weixin
*/
"preloadRule": {
},
/*
多線程 Worker
一些異步處理的任務，可以放置於 Worker 中運行，待運行結束后，再把結果返回到小程序主線程。Worker 運行於一個單獨的全局上下文與線程中，不能直接調用主線程的方法。
Worker 與主線程之間的數據傳輸，雙方使用 Worker.postMessage() 來發送數據，Worker.onMessage() 來接收數據，傳輸的數據並不是直接共享，而是被復制的。
使用流程
在開發者工具中預覽效果
1. 配置 Worker 信息
在 app.json 中可配置 Worker 代碼放置的目錄，目錄下的代碼將被打包成一個文件：
配置示例：
{
"workers": "workers"
}
2. 添加 Worker 代碼文件
根據步驟 1 中的配置，在代碼目錄下新建以下兩個入口文件：
workers/request/index.js
workers/request/utils.js
workers/response/index.js
添加后，目錄結構如下：
├── app.js
├── app.json
├── project.config.json
└── workers
├── request
│ ├── index.js
│ └── utils.js
└── response
└── index.js
3. 編寫 Worker 代碼
在 workers/request/index.js 編寫 Worker 響應代碼
const utils = require('./utils')
// 在 Worker 線程執行上下文會全局暴露一個 worker 對象，直接調用 worker.onMessage/postMessage 即可
worker.onMessage(function (res) {
console.log(res)
})
4. 在主線程中初始化 Worker
在主線程的代碼 app.js 中初始化 Worker
const worker = wx.createWorker('workers/request/index.js') // 文件名指定 worker 的入口文件路徑，絕對路徑
5. 主線程向 Worker 發送消息
worker.postMessage({
msg: 'hello worker'
})
worker 對象的其它接口請看 worker接口說明
注意事項
Worker 最大並發數量限制為 1 個，創建下一個前請用 Worker.terminate() 結束當前 Worker
Worker 內代碼只能 require 指定 Worker 路徑內的文件，無法引用其它路徑
Worker 的入口文件由 wx.createWorker() 時指定，開發者可動態指定 Worker 入口文件
Worker 內不支持 wx 系列的 API
Workers 之間不支持發送消息
Worker 目錄內只支持放置 JS 文件，其他類型的靜態文件需要放在 Worker 目錄外
基礎庫 v2.18.1 開始支持在插件內使用 worker。相應地，插件使用worker前需要在plugin.json內配置workers代碼路徑，即一個相對插件代碼包根目錄的路徑。
*/
"workers": "asyncApi",
/*
topWindow
uni-app 2.9+ 新增 leftWindow, topWindow, rightWindow 配置。用於解決寬屏適配問題。
以現有的手機應用為mainWindow，在左、上、右，可以追加新的頁面顯示窗體。
整體的寬屏適配思路，參考單獨的寬屏適配指南
屬性 類型 默認值 描述
path String 配置頁面路徑
style Object 配置頁面窗口表現，配置項參考下方 pageStyle
matchMedia Object 配置顯示該窗口的規則，配置項參考下方 matchMedia
注意
目前 style 節點僅支持配置 width，height 等 css 樣式相關屬性
如果需求當存在 topwindow 時，自動隱藏頁面的 navigationBar，根據需求不同在App.vue中配置如下 css：
只需要隱藏某個的頁面 navigationBar
<!-- 隱藏路徑為 pages/component/view/view 頁面的 navigationBar -->
.uni-app--showtopwindow [data-page="pages/component/view/view"] uni-page-head {
display: none;
}
需要隱藏大部分頁面的 navigationBar，顯示某個頁面的 navigationBar
<!-- 隱藏所有頁面的 navigationBar -->
.uni-app--showtopwindow uni-page-head {
display: none;
}
<!-- 顯示路徑為 pages/component/view/view 頁面的 navigationBar -->
.uni-app--showtopwindow [data-page="pages/component/view/view"] uni-page-head {
display: block;
}
關於布局
https://hellouniapp.dcloud.net.cn/pages/component/view/view
通過matchMedia的調節，可以自適應在不同屏幕上顯示指定的window。
{
"pages": [
{
"path": "pages/login/login",
"style": {
"topWindow": false // 當前頁面不顯示 topWindow
"leftWindow": false // 當前頁面不顯示 leftWindow
"rightWindow": false // 當前頁面不顯示 rightWindow
}
}
],
"topWindow": {
"path": "responsive/top-window.vue", // 指定 topWindow 頁面文件
"style": {
"height": "44px"
}
},
"leftWindow": {
"path": "responsive/left-window.vue", // 指定 leftWindow 頁面文件
"style": {
"width": "300px"
}
},
"rightWindow": {
"path": "responsive/right-window.vue", // 指定 rightWindow 頁面文件
"style": {
"width": "300px" // 頁面寬度
},
"matchMedia": {
"minWidth": 768 //生效條件，當窗口寬度大於768px時顯示
}
}
}
案例演示：HBuilderX 2.9.9+，新建項目選擇hello uni-app或新聞模板，或直接瀏覽：https://hellouniapp.dcloud.net.cn/
*/
"topWindow" : {
/*
minWidth Number 768 當設備可見區域寬度 >= minWidth 時，顯示該 window
*/
"matchMedia" : {
}
},
"leftWindow" : {
},
"rightWindow" : {
}
}