You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

84 lines
1.8 KiB

<template>
<view>
<m-tabbar fixed fill :current="current" safeBottom :tabbar="tabbar" native openType="switchTab" @click="tabClick">
<template v-slot:tabbar_index_1>
<view class="custom_style">
<view class="custom_style_icon">
<u-image src="/static/ai.png" width="160rpx" height="160rpx"/>
</view>
</view>
</template>
</m-tabbar>
</view>
</template>
<script>
export default {
name: "customTabbar",
props: {
current: {
default: 0,
type: Number
}
},
data() {
return {
tabbar: {
color: "#333",
selectedColor: "#2ACF8D",
borderStyle: "F0F0F0",
backgroundColor: "#FFFFFF",
list: [
{
"pagePath": "pages/index/index",
"iconPath": "static/tabbar/home.png",
"selectedIconPath": "static/tabbar/home-selected.png",
"text": "首页"
},
{},
{
"pagePath": "pages/user/index",
"iconPath": "static/tabbar/user.png",
"selectedIconPath": "static/tabbar/user-selected.png",
"text": "我的"
}
]
}
}
},
methods: {
tabClick(val){
if (val === 0 && this.current === 0) this.$jump({url: '/pages/index/index'})
}
},
mounted() {
console.log(this.current)
},
}
</script>
<style lang="scss">
.custom_style {
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: 24rpx;
width: 100rpx;
height: 100rpx;
margin-top: -40rpx;
&_icon {
//background-color: #2ACF8D;
font-size: 80rpx;
width: 100rpx;
height: 100rpx;
border-radius: 100%;
display: flex;
justify-content: center;
align-items: center;
}
}
</style>