zoukankan      html  css  js  c++  java
  • 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);
    

      

      

      

  • 相关阅读:
    git clone代码总是失败
    sublime常用快捷键及插件
    canvas圆形倒计时
    box-show的用法
    全选、反选
    数据库,增删改查
    PHP操作MySQL
    输出六个随机字符串
    约瑟夫环的故事
    Unix编程艺术——摘录一
  • 原文地址:https://www.cnblogs.com/karila/p/8039176.html
Copyright © 2011-2022 走看看