Axios with Vue - 如何用新数组替换端点数组

Question

我创建了一个 JSON 文件，其中包含如下所示的对象数组：

[
  {
    "id": "123",
    "type": "input",
    "title": "What is your dog's name?",
    "value": ""
  }
]

这个对象数组的端点是 http://localhost:3000/questions。

我有一个 Vue 表单，我正在循环并将 v-model 绑定到值属性。最终我将为每个问题提供一个对象，所以 6 个问题 = 6 个对象。

当用户提交表单时，我只是想用一个全新的对象数组替换这个对象数组（实际上是同一个数组，但值属性由用户填写）

我试过这个：

async updateQuestions({ state }) {
  await axios.post("http://localhost:3000/questions", state.questions);
},

得到这个：

[
  {
    "id": "123",
    "type": "input",
    "title": "What is your dog's name?",
    "value": ""
  },
  [
    {
      "id": "123",
      "type": "input",
      "title": "What is your dog's name?",
      "value": "dd"
    }
  ]
]

我不想追加到现有数组而是替换它：

[
  {
    "id": "123",
    "type": "input",
    "title": "What is your dog's name?",
    "value": "dd"
  }
]

如何使用 Axios 完成此操作？提前致谢。

Answer 1

对于遇到过类似问题的任何人，问题的发生是因为 'questions' 数组需要放置在单个根对象中。

不好：

[
  {
    "id": "0",
    "type": "input",
    "title": "What is your dog's name?",
    "value": ""
  }
]

好：

{
  "questions": [
    {
      "id": "0",
      "type": "input",
      "title": "What is your dog's name?",
      "value": ""
    }
  ]
}

Axios with Vue - 如何用新数组替换端点数组

Axios with Vue - How to replace endpoint array with new array

axios

vuejs2