ts watch路由 参数变化_vue watch 监听路由变化
首頁
列表頁
購物車
會員中心
import store from "../../store"
import { mapState, mapActions } from "vuex"
export default{
// vue使用props動態傳值給子組件里面的函數用
props:['floorTitle'],
data(){
return{
active: 0
}
},
created(){
this.changeTabActive()
},
watch:{? // 當數據發生改變的時候再賦值
// floorData 監視的對象
},
computed: {
...mapState({
items: state => store.state.shopcart.items,
totalNumber: state => store.state.shopcart.totalNumber,
totalMoney: state => store.state.shopcart.totalMoney,
itemCount: state => store.state.shopcart.itemCount
})
},
updated(){
this.changeTabActive()
},
methods:{
changeTabbar(active){
console.log(active)
switch (active) {
case 0:
//使用name跳轉，因為路徑有時候會改變，這樣就需要改編程式導航，比較麻煩
this.$router.push({name:'Main'})
break;
case 1:
this.$router.push({name:'goodsList'})
break
case 2:
this.$router.push({name:'cart'})
break
case 3:
this.$router.push({name:'user'})
default:
break;
}
},
changeTabActive(){
this.nowPath=this.$route.path? //vue提供的方法
if(this.nowPath=="/shoppingMall"){
this.active=0
}else if(this.nowPath=="/goodsList"){
this.active=1
}else if(this.nowPath=="/cart"){
this.active=2
}else if(this.nowPath=="/user"){
this.active=3
}
}
},
watch:{
'$route': 'changeTabActive'
}
}
總結
以上是生活随笔為你收集整理的ts watch路由 参数变化_vue watch 监听路由变化的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 瑞士桁架机器人_机器人库晚报：人工智能可
- 下一篇： 中文问好_直击／泷泽秀明秘访台！Hey!