vue-cli3 + ts + vuex


推薦使用vuex-class 官方介紹

npm install --save vuex-class
# or 
yarn add vuex-class

本文也圍繞着vuex-class進行介紹(目前我就會這一種)主要介紹取值和賦值使用方法說明如下:

store.ts中的寫法:

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

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    count:0
  },
  mutations: {
    setCount(state,value) {
      state.count = value
    }
  },
  actions: {
     setCount(state,value) {
       this.commit('setCount',value)
    }
  },
});
  

取值或賦值的寫法:

 

import {Component, Vue} from 'vue-property-decorator';
import {State, Action, Mutation} from 'vuex-class';
@Component({})
export default class Main extends Vue {
    @State('count') stateCount: any
    @Mutation('setCount') setStateCount: any
    @Action('setCOunt') asyncSetStateCount: any
    created() {
        console.log(this.stateCount)  // 取值  
        this.setCount(1)  // 同步賦值
        this.asyncSetStateCount(2)  //異步賦值
    }
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM