vuex 알 수 없는 작업(또는 변환) 유형

vuex 알 수 없는 작업(또는 변환) 유형

나는 Nuxt 애플리케이션에 토큰을 저장하기 위해 간단한 코드를 작성하고 있습니다.스토어에서 변환 또는 작업을 호출하려고 하면 콘솔에 이 오류가 기록됩니다. [vuex] 알 수 없는 작업 유형: setToken

import Vuex from 'vuex';

export const store = new Vuex.Store({
    state:()=> ({
        token: ''
    }),
    getters: {
        getToken: state => {
            return state.token;
        }
    },
    mutations: {
        setToken: (tokenStr) => {
            state.token = tokenStr;
        }
    },
    actions: {
        setToken: ({ commit }, tokenStr) => {
            commit('setToken', tokenStr);
        }
    }
})

다음은 변환을 호출하는 방법입니다.

methods:{
  setToken(){
    this.$store.dispatch('setToken','token1');
    this.token = this.$store.getters.token;
  }
}

당신은 '클래식'을 사용하고 있으며 이제는 사용되지 않는 vuex 저장소 설정 방법을 다음에 사용하고 있습니다.다음과 같이 설정해야 합니다.

// store/index.js
export const state = () => ({
  token: ''
})

export const mutations = {
  SET_TOKEN (state, tokenStr) {
    state.token = tokenStr
}

export const actions = {
  setToken ({ commit }, tokenStr) {
    commit('SET_TOKEN', tokenStr)
  }
}

export const getters = {
  token: (state) => state.token
}

Nuxt가 거기서 당신을 위해 가게를 지을 것입니다.여기 의사 선생님이 보실 수 있습니다.

이 기능을 사용하여 구성 요소의 작업을 발송할 수 있습니다.$store.dispatch('xxx') 또는 구성 요소 메서드를 store.dispatch 호출에 매핑하는 mapActions 도우미를 사용합니다(루트 저장소 주입 필요).작업을 발송하는 다른 방법

    import { mapActions } from 'vuex'

export default {
  // ...
  methods: {
...mapActions([
  'increment', 
// map `this.increment()` to 

this.$store.dispatch('increment')

  // `mapActions` also supports payloads:
  'incrementBy' // map `this.incrementBy(amount)` to `this.$store.dispatch('incrementBy', amount)`
]),
...mapActions({
  add: 'increment' // map `this.add()` to `this.$store.dispatch('increment')`
})

} }

언급URL : https://stackoverflow.com/questions/56234410/vuex-unknown-action-or-mutation-type