반응형
Vuex - 네임스페이스 + mapMutations + 함수?
아래 mapMutations에서 네임스페이스를 사용하는 방법은 무엇입니까?
methods: {
addTodo() {
this.$store.commit('todos/addTodo', this.text)
this.text = ''
}
}
시도 대상:
methods: {
...mapMutations('todos', {
addTodo () {
this.$store.commit('addTodo', this.text)
this.text = ''
}
})
}
다음의 에러가 표시됩니다.
commons.app.js:19729 [vuex] unknown mutation type: addTodo
좋은 생각 있어요?
실제로는 돌연변이를 매핑하는 것이 아니라 커밋하는 함수를 추가하는 것이기 때문에 당신의 경우에는 작동하지 않습니다.addTodo알 수 없는 네임스페이스에서 변환되었습니다.변화하는this.$store.commit('addTodo', this.text)로.this.$store.commit('todos/addTodo', this.text)문제를 해결할 수도 있지만, 여전히 적절한 사용 방법은 아닙니다.mapMutations.mapMutations돌연변이를 가져오고 나중에 다른 방법처럼 부를 수 있게 되어 있습니다.리셋과 같은 추가 로직이 필요한 경우text다음 예시와 같이 커밋을 다른 방법으로 랩해야 합니다.
methods: {
...mapMutations("todos", ["ADD_TODO"]),
addTodo() {
this.ADD_TODO(this.text);
this.text = "";
}
}
또는 변환 별칭을 사용하는 경우:
methods: {
...mapMutations("todos", { addTodoMutation: 'ADD_TODO' }),
addTodo() {
this.addTodoMutation(this.text);
this.text = "";
}
}
https://codesandbox.io/s/yvjvll56oj
언급URL : https://stackoverflow.com/questions/56119169/vuex-namespace-mapmutations-functions
반응형
'programing' 카테고리의 다른 글
| 요청된 대상에 대한 올바른 인증 경로를 찾을 수 없음 - 인증서를 가져온 후에도 오류가 발생했습니다. (0) | 2022.07.16 |
|---|---|
| Vee-validate는 항상 true를 반환합니다. (0) | 2022.07.16 |
| Java에서 사용자 정의 예외를 만드는 방법 (0) | 2022.07.16 |
| 팬텀을 사용하여 PDF를 생성하려고 하면 Vue.js가 렌더링되지 않습니다.js (0) | 2022.07.16 |
| Vuex - 어떤 데이터가 스토어를 통해 전송되어야 합니까? (0) | 2022.07.16 |