如何在app.json配置頂部導航和底部導航?

2290次閱讀

app.json文件在后臺是看不到的,是在后臺打包的時候動態(tài)生成的,是根據(jù)后臺的導航、頂部導航和底部導航的設置生成的文件。

app.json需要用開發(fā)者工具打開才能看到。

1、pages頁面路徑列表

"pages": [

"pages/index/index",? ? ? ? ? ? ? ? ? ? ? ? 首頁

"pages/index/list_product",? ? ? ? ? ? ? 產品列表

"pages/index/index_product",? ? ? ? ? 產品中心

"pages/index/index_article",? ? ? ? ? ? ?文章中心

"pages/index/info_product",? ? ? ? ? ? ?產品詳情

"pages/index/list_article",? ? ? ? ? ? ? ? ?文章列表

"pages/index/info_article",? ? ? ? ? ? ? ?文章詳情

"pages/index/page",? ? ? ? ? ? ? ? ? ? ? ? ?單頁面

"pages/index/page_8",? ? ? ? ? ? ? ? ? ? ?自定義頁面,和page類似

"pages/index/solution",? ? ? ? ? ? ? ? ? ? 自定義頁面,解決方案

"pages/index/ask"? ? ? ? ? ? ? ? ? ? ? ? ? ? 自定義頁面,在線留言

]

2、window全局的默認窗口表現(xiàn)

"window": {

"navigationBarBackgroundColor": "#ffffff",? ? ? ? ? ??頂部標題欄背景顏色

"navigationBarTitleText": "興邦科技小程序",? ? ? ? ? ??頂部標題欄 標題文字內容

"navigationBarTextStyle": "black",? ? ? ? ? ? ? ? ? ? ? ? ??頂部標題欄標題顏色

"backgroundTextStyle": "black",? ? ? ? ? ? ? ? ? ? ? ? ? ? ?下拉 loading 的樣式,僅支持 dark / light,默認值:dark

"enablePullDownRefresh": false

}

3、底部 tab 欄的表現(xiàn),即底部導航

"tabBar": {

"color": "#ffffff",? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 底部導航默認文字顏色

"selectedColor": "#000000",? ? ? ? ? ? ? ?底部導航選中時文字顏色

"borderStyle": "black",? ? ? ? ? ? ? ? ? ? ? ??底部導航邊框顏色

"backgroundColor": "#C00;",? ? ? ? ? ? ??底部導航背景顏色

"list": [{

"pagePath": "pages/index/index",? ? ? ? ? ? ? ? ? ? ? ? ? ?底部導航首頁代碼路徑

"iconPath": "images/index_img.png",? ? ? ? ? ? ? ? ? ? ? 底部導航首頁默認顯示的圖標

"selectedIconPath": "images/index_img.png",? ? ? ??底部導航首頁選中時顯示的圖標

"text": "首頁"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 底部導航首頁顯示的文字

}, {

"pagePath": "pages/index/index_product",? ? ? ? ? ? ? ??底部導航產品中心代碼路徑

"iconPath": "images/product_footer.png",? ? ? ? ? ? ? ? ?底部導航產品中心默認顯示的圖標

"selectedIconPath": "images/product_footer.png",? ? ?底部導航產品中心選中時顯示的圖標

"text": "產品中心"? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ??底部導航產品中心顯示的文字

}, {

"pagePath": "pages/index/index_article",

"iconPath": "images/news_footer.png",

"selectedIconPath": "images/news_footer.png",

"text": "新聞中心"

},{

"pagePath": "pages/index/solution",

"iconPath": "images/index_service.png",

"selectedIconPath": "images/index_service.png",

"text": "解決方案"

}, {

"pagePath": "pages/index/ask",

"iconPath": "images/message_footer.png",

"selectedIconPath": "images/message_footer.png",

"text": "在線留言"

}]

}

本文由夫唯SEO特訓營編輯整理。

搜外專注SEO培訓和SEO周邊Saas服務解決方案,10年來超過五萬學員在此獲得技術提升和人脈圈子。

SEO課程包含移動搜索、零基礎建站、群站SEO思維、搜外6系統(tǒng)、SEM入門等。

192期A班報名時間7月1日-7月15日,請?zhí)砑诱猩头∧⑿牛簊eowhy2021。 微信掃碼添加客服人員

我們的目標是:讓非技術人員輕松學會互聯(lián)網(wǎng)技術。

  • 搜外會員SEO交流群(免費)

    微信掃碼添加客服人員
  • 小程序運營交流群(免費)

    微信掃碼添加客服人員
  • 搜外會員SEM競價交流群(免費)

    微信掃碼添加客服人員
  • 夫唯學員SEO交流群(VIP)

    微信掃碼添加客服人員

掃碼獲取資源

微信掃碼添加客服人員
  • SEO技術實戰(zhàn)微信群

    微信掃碼添加客服人員
  • 大站流量總監(jiān)群(審核身份)

    微信掃碼添加客服人員
  • Google獨立站英文SEO群

    微信掃碼添加客服人員
  • SEO團隊KPI管理表格

    微信掃碼添加客服人員
  • 工業(yè)品網(wǎng)站友情鏈接群

    微信掃碼添加客服人員
  • 本地生活服務業(yè)友鏈群

    微信掃碼添加客服人員

跟夫唯老師系統(tǒng)學習群站SEO
成為互聯(lián)網(wǎng)運營推廣大咖

掌握SEO技巧、建站前端、群站霸屏、SEM入門、新聞源推廣……
Processed in 0.178454 Second , 51 querys.