- 第一步在app.json文件中配置
"tabBar": {
"custom": true,
}
- 与pages同级创建custom-tab-bar文件夹
- 在js文件中
Component({
/**
* 组件的初始数据
*/
data: {
list: [{
"pagePath": "/pages/home/index",
"text": "首页"
}, {
"pagePath": "/pages/classify/index",
"text": "分类"
}, {
"pagePath": "/pages/cart/index",
"text": "购物车"
}, {
"pagePath": "/pages/user/index",
"text": "个人"
}],
selected: '/pages/home/index'
},
attached() {
let selected = wx.getStorageSync('selected') ? wx.getStorageSync('selected') : '/pages/home/index';
this.gotoPages(selected);
},
/**
* 组件的方法列表
*/
methods: {
gotoSwitch(e) {
const { item } = e.currentTarget.dataset;
if (this.data.selected === item.pagePath) return;
this.gotoPages(item.pagePath);
},
gotoPages(page) {
this.setData({
selected: page
}, () => {
wx.setStorageSync('selected', page);
wx.switchTab({
url: page,
});
});
},
}
})
