最近想在项目上使用vue,因为是移动端我选择了饿了么的mintUI,发现坑居多
底部导航切换设置路由不跳转,搜了好多都没有说到点上,为了让大家少走几步弯路直接上代码吧!
<template>
<mt-tabbar v-model="selected">
<!-- @click="goHome" -->
<mt-tab-item >
财务
</mt-tab-item>
</mt-tabbar>
</template>
<script>
export default {
data(){
return {
selected:"",
title:""
}
},
created(){
this.selected = this.$route.name;
},
methods:{
goHome(){
if(this.$route.name !== 'home'){
this.$router.push({ name: 'home', params: { titles: '首页' }})
}
},
goManage(){
if(this.$route.name !== 'manage'){
this.$router.push({ name: 'manage', params: { titles: '管理' }})
}
},
goActive(){
if(this.$route.name !== 'active'){
this.$router.push({ name: 'active', params: { titles: '活动' }})
}
},
goFinance(){
if(this.$route.name !== 'finance'){
this.$router.push({ name: 'finance', params: { titles: '财务' }})
}
}
}
}
</script>
<style>
</style>
其实只要给click后面加一个native就好了,至于什么道理我也不知,问题是解决了