[](https://www.guqule.com)
丸子官方網站:[www.guqule.com](https://www.guqule.com)
丸子客服微信:hackdxd
* [ ] **特別注意提醒**
除了丸子小程序其他渠道購買全部為盜版產品,丸子客服微信:hackdxd
## 底部菜單修改
除了丸子小程序其他渠道購買全部為盜版產品,丸子客服微信:hackdxd
1、修改 app.json 的 “tabBar” 項中的 “list” 列表項。
~~~
"tabBar": {
"custom": true,
"color": "#3C3C3C",
"selectedColor": "#35495e",
"borderStyle": "black",
"backgroundColor": "#ffffff",
"list": [
{
"pagePath": "pages/tabbar/index/index",
"iconPath":"/image/home_d@3x.png",
"selectedIconPath":"/image/home_d@3x.png"
},
{
"pagePath": "pages/tabbar/circle/circle",
"iconPath":"/image/home_d@3x.png",
"selectedIconPath":"/image/home_d@3x.png"
},
{
"pagePath": "pages/tabbar/message/message",
"iconPath":"/image/home_d@3x.png",
"selectedIconPath":"/image/home_d@3x.png"
},
{
"pagePath": "pages/tabbar/mine/mine",
"iconPath":"/image/home_d@3x.png",
"selectedIconPath":"/image/home_d@3x.png"
}
]
},
~~~
注意:pagePath 頁面地址不能帶有參數,即不支持 pages/detail/detail?id=88 類似這種帶有問號參數的鏈接
2、修改 custom-tab-bar 目錄里的 index.js 的 “list” 對應的 pagePath 與 app.json 里的 “list” 對應的 pagePath 相同
~~~
data: {
selected: 0,
unReadMessageCount: 0,
sysMessageCount: 0,
color: "#B0A9A3",
selectedColor: "#2E2E2E",
fontWeight: "bold",
list: [{
pagePath: "/pages/tabbar/index/index",
iconPath: "/image/tabbar/tab_index_normal.png",
selectedIconPath: "/image/tabbar/tab_index_active.png",
text: "首頁"
}, {
pagePath: "/pages/tabbar/circle/circle",
iconPath: "/image/tabbar/tab_nearby_normal.png",
selectedIconPath: "/image/tabbar/tab_nearby_active.gif",
text: "圈子"
}, {
pagePath: "/pages/creat/creat",
iconPath: "/image/tabbar/icon_add.png",
selectedIconPath: "/image/tabbar/icon_add.png",
text: "",
isSpecial: !0
}, {
pagePath: "/pages/tabbar/message/message",
iconPath: "/image/tabbar/tab_message_normal.png",
selectedIconPath: "/image/tabbar/tab_message_active.png",
text: "消息"
}, {
pagePath: "/pages/tabbar/mine/mine",
iconPath: "/image/tabbar/tab_user_normal.png",
selectedIconPath: "/image/tabbar/tab_user_active.png",
text: "我的"
}]
},
~~~
注意:除了中間發布的按鈕,其他頁面的參數及順序必須一致。
3、修改指定 pagePath 頁面的 js 文件 onShow 函數加上對應內容
~~~
onShow: function () {
"function" == typeof this.getTabBar && this.getTabBar() && this.getTabBar().setData({
selected: 1
})
//其他代碼部分
},
~~~
注意:selected 的值是 custom-tab-bar/index.js 參數 “list” 對應的位置
假如你修改了消息位置為資訊,那么就要在資訊頁對應的 js 頁面,onShow 函數加上以下內容
~~~
"function" == typeof this.getTabBar && this.getTabBar() && this.getTabBar().setData({
selected: 3
})
~~~
因為,消息位置是在 custom-tab-bar/index.js 的 “list” 列表中屬于第 3 項(從 0 計算)。
另外,需要把對應的 message.js 里的 onShow 函數刪除上面的那部分內容。
- 丸子小程序介紹
- 系統介紹
- 版權公告
- 購買產品
- 疑問解答
- 增值服務
- 域名服務器安裝配置
- 域名解析配置
- 服務安裝配置
- 視頻教程安裝
- 寶塔面板安裝配置
- 開始安裝寶塔面板
- 寶塔面板環境安裝
- 寶塔安裝WordPress網站
- 新建WordPress站點
- 安裝配置WordPress站點
- WordPress配置SSL偽靜態
- 小程序注冊配置
- 小程序注冊
- 小程序配置
- 安裝配置小程序插件
- 下載小程序插件
- 安裝小程序插件
- 激活小程序插件
- 設置小程序插件
- 安裝插件中心擴展
- 資訊版配置
- 插件配置
- 常規配置
- 優化設置
- 功能擴展
- 焦點設置
- 廣告設置
- 積分設置
- 微信搜一搜內容接入
- 分類設置
- 文章發布
- 訂閱消息設置
- 小程序源碼下載
- 小程序源碼導入
- 小程序提交審核
- 二開/常見問題解決
- 頁面路徑
- 頁面背景@版權等修改
- 頁面配置修改
- 代碼高亮設置
- 修改字段
- 修改logo
- 百度小程序SEO說明
- 評論審核失敗解決
- uniapp編譯教程
- uniapp基礎安裝說明
- uniapp詳細編譯丸子小程序
- 社區版配置
- 插件基本設置
- 社區話題配置
- 創建圈子設置
- 簽到打卡圈子
- 如何發布話題
- 商城配置教程
- 積分閱讀配置
- 消息發送設置
- 商品卡設置
- 訂閱消息配置
- 郵件通知配置
- 云存儲配置
- 騰訊云OSS設置
- 阿里云OSS設置
- 七牛云存儲設置
- 廣告教程設置
- 小程序源碼下載
- 開發者工具導入源碼
- 提交審核
- 二開/常遇到問題
- 丸子社區(丸小圈)底部 tabBar 菜單修改教程
- 社區版小工具配置及餓了么返傭設置教程
- 小程序直播配置
- 摘要超出解決
- 發布評論審核問題解決
- 問題幫助指南
- 文章圈子話題置頂
- 全網服務器推薦
- WordPress進階版