<template>
|
<view>
|
<u-tabbar
|
:value="index"
|
@change="change"
|
fixed
|
activeColor="#222"
|
inactiveColor="#666"
|
>
|
<u-tabbar-item text="待办">
|
<view class="" slot="active-icon">
|
<image src="@/static/nav_daiban_sel@2x.png" class="icon-style" mode=""></image>
|
</view>
|
<view class="" slot="inactive-icon">
|
<image src="@/static/nav_daiban@2x.png" class="icon-style" mode=""></image>
|
</view>
|
</u-tabbar-item>
|
<u-tabbar-item text="工作台">
|
<view class="" slot="active-icon">
|
<image src="@/static/nav_gongzuotai_sel@2x.png" class="icon-style" mode=""></image>
|
</view>
|
<view class="" slot="inactive-icon">
|
<image src="@/static/nav_gongzuotai@2x.png" class="icon-style" mode=""></image>
|
</view>
|
</u-tabbar-item>
|
<u-tabbar-item text="我的">
|
<view class="" slot="active-icon">
|
<image src="@/static/nav_wode_sel@2x.png" class="icon-style" mode=""></image>
|
</view>
|
<view class="" slot="inactive-icon">
|
<image src="@/static/nav_wode@2x.png" class="icon-style" mode=""></image>
|
</view>
|
</u-tabbar-item>
|
</u-tabbar>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
name:"myTabbar",
|
props: {
|
index: 0
|
},
|
data() {
|
return {
|
value: 0
|
};
|
},
|
methods: {
|
click(index) {
|
// console.log('click', index);
|
// this.$nextTick(() => {
|
// this.value = index
|
// if (index==0) {
|
// uni.switchTab({
|
// url: '/pages/index/index'
|
// });
|
// } else if (index== 1) {
|
// uni.switchTab({
|
// url: '/pages/service/service'
|
// });
|
// }else {
|
// uni.switchTab({
|
// url: '/pages/mine/mine'
|
// });
|
// }
|
// })
|
},
|
change(index) {
|
this.$nextTick(() => {
|
this.value = index
|
})
|
|
console.log(index);
|
if (index==0) {
|
// console.log('index');
|
uni.switchTab({
|
url: '/pages/index/index'
|
});
|
} else if (index== 1) {
|
// console.log('workbench');
|
uni.switchTab({
|
url: '/pages/workbench/workbench'
|
});
|
}else {
|
// console.log('mine');
|
uni.switchTab({
|
url: '/pages/mine/mine'
|
});
|
}
|
}
|
},
|
}
|
/**
|
*
|
* */
|
</script>
|
|
<style lang="scss" scope>
|
.icon-style {
|
width: 44rpx;
|
height: 44rpx;
|
}
|
</style>
|