vuex------点击不同的按钮高亮显示

1、组件定义

//三个按钮绑定相同的函数，传递不同的参数
 @click="changeList('all')"
 @click="changeList('undone')"
 @click="changeList('done')"

methods:{
  changeList(key){

  //打印传递过来的参数
  console.log(key)
  this.$store.commit('changeViewKey',key)
}
}

2、 vuex设置行为

state:

state:{
  viewKey:'all'
}

mutations:

mutations:{
 //修改视图关键字
changeViewKey(state,key){
 state.viewKey=key
}
}

3、组件的使用

computed:{
 ...mapState(['viewKey'])
}

template type动态绑定