javascript - Comment Vuex appelle-t-il des actions sur une page?

Question

Code de la page

methods: {
    ...mapActions(['addList', 'delList']),
    add (value) {
      this.addList({title: value})
    },
    del (item) {
      this.delList(item)
    }
}

Code en actions

import * as types from './mutations'
export const addList = ({commit}, item) => {
  commit(types.ADD_LIST, item)
}    
export const delList = ({commit}, item) => {
  commit(types.DELETE_LIST, item)
}

Mais l'exécution signalera [vuex] Attend une chaîne comme type, mais fonction trouvée. Veuillez me faire savoir ce qui ne va pas. Merci beaucoup
Si vous remplacez le code ci-dessus par le code suivant, il peut être exécuté

.

methods: {
    add (value) {
      this.$store.commit('ADD_LIST', {title: value})
    },
    del (item) {
      this.$store.commit('DELETE_LIST', item)
    }
}

Answer 1

methods: {
    add (value) {
      this.$store.commit('ADD_LIST', {title: value})
    },
    del (item) {
      this.$store.commit('DELETE_LIST', item)
    }
}

Je demande simplement, vous avez dit que ce code peut être exécuté pour obtenir l'effet, alors pourquoi pas this.$store.commit(types.DELETE_LIST, item) ?this.$store.commit(types.DELETE_LIST, item)?

你actions.js中都用了types，是不是mutation-types.js

Vous utilisez des types dans actions.js. Y a-t-il un problème avec le fichier mutation-types.js ? 🎜

Answer 2

export const addList = (commit) => (item) => {
  commit(types.ADD_LIST, item)
} 

Je n'ai jamais utilisé vuex, mais s'il est similaire à Redux, il devrait être utilisé de cette façon.

Answer 3

J'ai trouvé la réponse à la question. Merci pour le rappel à l'étage. Le fichier actions.js doit être modifié comme suit

.

export const addList = ({commit}, item) => {
  commit('ADD_LIST', item)
}    
export const delList = ({commit}, item) => {
  commit('DELETE_LIST', item)
}

Ou utilisez la méthode d'écriture précédente, mais créez un nouveau fichier mutation-types.js

export const ADD_LIST = 'ADD_LIST'
export const DELETE_LIST = 'DELETE_LIST'

actions.js

import * as types from './mutation-types'
export const addList = ({commit}, item) => {
  commit(types.ADD_LIST, item)
}    
export const delList = ({commit}, item) => {
  commit(types.DELETE_LIST, item)
}