vuex

最近学习vuex,记记他通常的用法

1、引入vuex

npm install vuex --save-dev

2、在main.js中引入

var app = new Vue({
  el: '#app',
  router,
  store,
  template: '<App/>',
  components: { App }
})

3、在store中定义的相关数据

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

const store = new Vuex.Store({
  state: {
    selected: '',
    selected1: '',
    selected2: '',
    userInfoSectionName: '',
    userInfoInputAge: '',
    userInfoPhone: '',
    userInfoIdCard: '',
    textareaHolder: '',
    userInfoInputSex: ''
  },
  mutations: {
    selected (state,message) {
      state.selected = message;
    },
    selected1 (state,message) {
      state.selected1 = message;
    },
    selected2 (state,message) {
      state.selected2 = message;
    },
    userInfoSectionName (state,message) {
      state.userInfoSectionName = message;
    },
    userInfoInputAge (state,message) {
      state.userInfoInputAge = message;
    },
    userInfoPhone (state,message) {
      state.userInfoPhone = message;
    },
    userInfoIdCard (state,message) {
      state.userInfoIdCard = message;
    },
    textareaHolder (state,message) {
      state.textareaHolder = message;
    },
    userInfoInputSex (state,message) {
      state.userInfoInputSex = message;
    }
  }
})

export default store;

4、引用

this.$store.commit('selected',this.selected);
          this.$store.commit('selected1',this.selected1);
          this.$store.commit('selected2',this.selected2);

  

  

  

原文地址:https://www.cnblogs.com/karila/p/8039176.html