字節(jié)跳動(dòng)小程序開發(fā)框架全局配置

app.json是一個(gè)用來對(duì)頭條小程序進(jìn)行全局配置的文件，用來配置頁面的路徑，窗口樣式表現(xiàn)等。

app.json的配置選項(xiàng)如下：

{
  "pages": [
    "pages/index/index",
    "pages/logs/index"
  ],
  "window": {
    "navigationBarTitleText": "Demo"
  },
  "tabBar": {
    "list": [{
      "pagePath": "pages/index/index",
      "text": "首頁"
    }, {
      "pagePath": "pages/logs/logs",
      "text": "日志"
    }]
  }
}

配置項(xiàng)說明

pages

這個(gè)字段用于配置小程序用到的所有頁面路徑，配置每項(xiàng)是 路徑 + 文件名 這個(gè)結(jié)構(gòu)。配置項(xiàng)的第一個(gè)頁面路徑就是小程序啟動(dòng)展示的第一個(gè)頁面。

需要注意：保證單個(gè)頁面的.json, .js, .ttml, .ttss資源都放在每個(gè)頁面路徑的首層

如開發(fā)目錄如下：

|____app.ttss
|____app.json
|____project.config.json
|____pages
|       |____index
|       |        |____index.js
|       |        |____index.json
|       |        |____index.ttml
|       |        |____index.ttss
|____app.js

那么app.json應(yīng)該這樣配置：

{
  "pages":[
    "pages/index/index"
  ]
}

window

這個(gè)字段用于設(shè)置小程序的狀態(tài)欄、導(dǎo)航條、標(biāo)題、窗口背景色。

tabBar

如果你的小程序包含多個(gè)tab（客戶端窗口的底部或頂部有 tab 欄可以切換頁面），可以通過 tabBar 配置項(xiàng)指定 tab 欄的表現(xiàn)，以及 tab 切換時(shí)顯示的對(duì)應(yīng)頁面。比如設(shè)置tab展示標(biāo)題和tab顏色等。

其中 list 接受一個(gè)數(shù)組，數(shù)組中的每個(gè)項(xiàng)都是一個(gè)對(duì)象，其屬性值如下：

navigateToMiniProgramAppIdList

當(dāng)小程序需要使用tt.navigateToMiniProgram接口跳轉(zhuǎn)到其他小程序時(shí)，需要先在配置文件中聲明需要跳轉(zhuǎn)的小程序appId列表，最多允許填寫 10 個(gè)。

page.json

頭條小程序的每一個(gè)頁面的窗口表現(xiàn)也可以通過頁面目錄下的.json文件進(jìn)行配置，這個(gè)頁面的獨(dú)立配置會(huì)比 app.json 要簡單；

如果 app.json 的 window 字段里面配置了某個(gè)頁面的窗口樣式，同時(shí)該頁面也在自己的 .json文件中做了對(duì)應(yīng)字段的配置的話，框架會(huì)優(yōu)先采用頁面里面的 .json 相應(yīng)配置項(xiàng)。

具體的配置字段如下：

例子：

{
  "navigationBarBackgroundColor": "#ffffff",
  "navigationBarTextStyle": "black",
  "navigationBarTitleText": "頭條接口功能演示",
  "backgroundColor": "#eeeeee",
  "backgroundTextStyle": "light"
}