Collectives™ on Stack Overflow
Find centralized, trusted content and collaborate around the technologies you use most.
Learn more about Collectives
Teams
Q&A for work
Connect and share knowledge within a single location that is structured and easy to search.
Learn more about Teams
Hi I am getting the Error like this
[vuex] unknown action type: addTodo
I am new to Vue js and now i am learing so could please help me to resolve this issue.
Code is like this
store/index.js
import { createStore } from 'vuex'
export default createStore({
state: {
todos: [
id: 1,
title: 'One'
id: 2,
title: 'Two'
id: 3,
title: 'Three'
getters: {
allTodos: (state) => state.todos,
mutations: {
addTodo({ commit }, todo){
commit("add_todo", todo)
actions: {
add_todo(state, todo){
state.todos.push(todo)
console.log(todo);
modules: {
and TodoInput.vue code is
<template>
<div class="row">
<input v-model="todoText" class="col form-control mx-2" type="text" />
<button @click="addTodo(todoText)" class="btn btn-primary">Add List</button>
</template>
<script>
import { mapActions } from 'vuex'
export default{
name: 'TodoInput',
data(){
return{
todoText: ''
methods:{
...mapActions(["addTodo"])
</script>
How can I solve above issue ?
–
Here make the below given changes in your store/index.js
file:
mutations: {
add_todo: (state, todo) => state.todos.push(todo),
actions: {
addTodo({ commit }, todo){
commit("add_todo", todo)
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.