关于Custom-Tabbar的使用问题？
如图所示，有stu,teacher,my三个界面，我想做一个stu,my的tabbar和一个teacher，my的tabbar，故采用了custom-tabbar。 用mode界面分别跳转到stu,teacher界面 但现在是偶尔会出现tabber不显示的问题，请问如何解决？ [图片][图片] [图片][图片] 这是custom-tabbar的相关文件 custom-tabbar/index.wxml <cover-view class="tab-bar">
<cover-view class="tab-bar-border"></cover-view>
<cover-view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}"
bindtap="switchTab">
<!-- <cover-image class="tab-bar-item-cover-image" src="{{selected === index ? item.selectedIconPath : item.iconPath}}">
</cover-image> -->
<cover-view class="tab-bar-item-cover-view" style="color: {{selected === index ? selectedColor : color}}">{{item.text}}</cover-view>
</cover-view>
</cover-view>
custom-tabbar/index.js const app = getApp();
Component({
data: {
selected: 0,
color: "#7A7E83",
selectedColor: "#ff6700",
list: []
},
lifetimes: {
//组件的生命周期函数
attached() {
var that = this
that.setData({
list: app.globalData.list
})
},
},
methods: {
switchTab(e) {
let that = this
const data = e.currentTarget.dataset
const url = data.path
that.setData({
selected: data.index
})
wx.switchTab({ url })
}
}
})
custom-tabbar/index.wxss .tab-bar {
position: fixed;
bottom: 0;
left: 0;
right: 0;
height: 48px;
background: white;
display: flex;
padding-bottom: env(safe-area-inset-bottom);
}
.tab-bar-border {
background-color: rgba(0, 0, 0, 0.33);
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
transform: scaleY(0.5);
}
.tab-bar-item {
flex: 1;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.tab-bar-item-cover-image {
width: 27px;
height: 27px;
}
.tab-bar-item-cover-view {
font-size: 15px;
}
{
"component": true
}
mode.js const app = getApp()
Page({
data: {},
stu: function () {
app.setTabbar1()
wx.switchTab({
url: '../stu/stu',
})
},
teacher: function () {
app.setTabbar2()
wx.switchTab({
url: '../teacher/teacher',
})
}
})
app.js //app.js
App({
onLaunch: function () {
// 展示本地存储能力
var logs = wx.getStorageSync('logs') || []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)
// 登录
wx.login({
success: res => {
// 发送 res.code 到后台换取 openId, sessionKey, unionId
}
})
// 获取用户信息
wx.getSetting({
success: res => {
if (res.authSetting['scope.userInfo']) {
// 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
wx.getUserInfo({
success: res => {
// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo = res.userInfo
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
}
})
}
}
})
},
setTabbar1: function () {
let that = this
that.globalData.list = [{
"pagePath": "/pages/stu/stu",
"text": "我参与的签到"
},
{
"pagePath": "/pages/my/my",
"text": "个人信息"
},
]
},
setTabbar2: function () {
let that = this
that.globalData.list = [{
"pagePath": "/pages/teacher/teacher",
"text": "我发起的签到"
},
{
"pagePath": "/pages/my/my",
"text": "个人信息"
},
]
},
globalData: {
userInfo: null,
backend: "http://10.21.234.24:8080",
list: []
}
})
