放置方法(在前端Vue上使用Axios)更改了错误的ID

时间:2019-08-11 03:06:33

标签: vue.js axios

我创建了一个Web应用程序,并且尝试使用PUT方法更改数据,但是它仅更改第一个ID的数据,而忽略了URL ID。 我只是前端的PUT方法有问题,背面的所有方法以及前端的所有其他方法都可以正常工作。

后端(带有节点,express和mongodb):

app.put('/registros/:id', (req, res) => {
  Registro.findOneAndUpdate(req.params.id, req.body, function (register) {
res.send(register);
  });
});

前端(带有Vue和axios):

   <template> 
     <form>
       <br />Data:
       <input v-model="date" />
       Descrição:
       <input v-model="description" />
       Tipo:
       <input v-model="type" />
       Valor:
       <input v-model="value" />
    </form>

      <table style="width:100%">
      <tr v-for="registro in registros">
      <button @click="editData(registro._id)">Edit</button>
      </tr>
     </table>
  </template>



  <script>

  export default {
    data() {
      return {
        registros: [],
        date: null,
        description: "",
        type: "",
        value: null
       };
     },
    methods: {
      editData(id) {
        let self = this;
          axios
           .put(`http://localhost:3000/registros/${id}`, {
              date: self.date,
              description: self.description,
              type: self.type,
              value: self.value
            })
           .then(function(answ) {});
    </script>

1 个答案:

答案 0 :(得分:0)

findOneAndUpdate的第一个参数应该是一个过滤器,而不仅仅是ID。

类似的东西:

Registro.findOneAndUpdate({_id: req.params.id}, ...

您当前拥有的方式将匹配所有文档,并仅更新第一个文档。