Vue - vuex Mutation用法

图片来自网络

关于vuex 是什么我就不在这里说了，不知道的同学自己去查一下哈

安装

• npm 安装（其他安装方式去官网找）

  npm install vuex --save
  

• 引入使用

  import Vue from 'vue'
  import Vuex from 'vuex'
  
  Vue.use(Vuex)
  
  export default new Vuex.Store({
        state: {
    transferVal: ''
      },
      mutations: {
          valuation(state, vla) {
              state.transferVal = vla
        }
      }
    })
  

然后挂载到实例上就可以使用了

• 在A组件中定义方法，执行后将val赋值给transferVal

  getOtherUrl(val) {
        this.$store.commit("valuation", val);
    },
  

• 写在在B组件的计算属性中

    computed: {
      myTitle: function() {
        return this.$store.state.transferVal;
      }
    },
  

  ---

  <el-button type="info" plain>{{myTitle}}</el-button>
  

• 这样就可以实时监听到这个值得变化，再对应做不同的操作

这里卿洋 愿喜❤️