Have trouble concating two arrys in Vuex-CodePudding

I have some trouble when concating two arrays in my store.js I have a to do list app that i want to get the first data from apiTask and then when creating new tasks it will concat apiTask with tasks. But it will show all properties after adding one task and the created task will be disappeared by adding the new one. I would appreciate if someone can help me with it. i have created a code sandbox of my project.

CodePudding user response：

try to separate your adding-new-task logic and setting apiTasks to tasks logic into two mutations. call the mutation with state.tasks = state.apiTasks assigning in your index.vue created/mounted hook

here's the example

CodePudding user response：

Maybe

ADD_TASK(state, task) {
    state.tasks.unshift({
        id: String(Math.floor(Math.random() * 999999999)),
        title: task.title,
        type: task.type,
        value: task.value,
        done: false
    })
  },

https://v2.vuejs.org/v2/guide/list.html#Array-Change-Detection