我希望在单击Add后，在tasks数组的顶部显示一个新的task todo标题。按钮。我用POST请求假API来做，但是有错误404，我在页面上看不到添加的todo。即使我在控制台中获得了新的任务对象。
https://stackblitz.com/edit/nuxt-bootstrap-vue-dynamic-img-bkwixg?file=pages%2Findex.vue,store%2Findex.js,components%2FTask.vue

// Store

const actions: {

const res = await fetch('https://dummyjson.com/todos/add', {
    method: 'POST',
    headers: {
      'Content-Type': 'appication/json;charset=utf-8',
    },
    body: JSON.stringify(data),
  });
  if (res.ok) {
    let result = await res.json();
    context.commit('addnewTask', result);
  }
  return res.ok;
},
}
export const mutations = {
  addnewTask(state, newTask) {
    state.tasks.unshift(newTask);
  },
}

// Child component

<template>
    <div class="create-new">
      <input
        type="text"
        v-model="todo"
        @keypress.enter="addTask"
        placeholder="add task"
      />
      <button @click="addTask">Add</button>
    </div>
    <div class="tasks">
      <Task v-for="task in tasks" :key="task.id" :task="task" />
    </div>
  </main>
</template>

<script>
export default {
  data() {
    return {
      todo: '',
      completed: false,

      search: '',
    };
  },
  computed: {
    tasks() {
      return this.$store.state.tasks;
    }
  methods: {
    addTask() {
      let newTask = {
        id: Math.floor(Math.random() * 25 + 200),
        todo: this.todo,
        completed: false,
      };
      if (newTask) {
        this.$store.dispatch('addTask', newTask);
}
    },