input的keyword与Vuex的双向绑定

准备

1. Vuex的store文件personalAblout.js
2. 组件：Personal.vue

实现

在路由中的状态管理的数据可以动态变化。

personalAblout.js

const personalAbout = {
    namespaced: true, //开启命名空间
    actions: {
    },
    mutations: {
        CHANGE_KEYWORD(state,value){
            state.searchKeyword=value
        }
    },
    state: {
        searchKeyword:''
    }
}

export default personalAbout

Personal.vue

   ...
                  <el-input v-model="Keyword" placeholder="请输入内容">
                         
                     </el-input>
...
    computed:{
        Keyword:{
            get(){
                return this.$store.state.personalAbout.searchKeyword;   //获取值
            },
            set(newV){
                // ...mapMutations("personalAbout",{})
                this.$store.commit("personalAbout/CHANGE_KEYWORD",newV)
            }
        }
    },