通过 PUT 方法更新 object

Question

我正在使用 MERN 堆栈创建待办事项应用程序。 后端是 MongoDB 数据库。 现在对于每个待办事项，都有一个查看详细信息按钮，可以查看有关该特定待办事项的更多信息。 单击该按钮后，架构 viewDetails 中就有此属性，该属性最初保持为 false，但一旦我单击它，它应该使用 true 值更新数据库并类似地切换。我可以在客户端更改 object 值，但在后端，它仍然需要更新。 我想用那个特定的待办事项 object 发起一个 PUT 调用并在数据库中更新它。 下面给出了相同 function 的代码： 这里的列表项中包含所有待办事项对象。

const [listItems, setListItems] = useState([]);
<button onClick={()=>handleClick(item._id)}>View Details</button>

const handleClick=(id)=>{
    const newTasks = [...listItems];
    newTasks.map((task)=>{
      if(task._id===id){
        task.viewDetails=!task.viewDetails;
      }
    });
    setListItems(newTasks);
       }
    

Answer 1

您可以使用PUT方法更新数据库中的 object。 您可以使用axios库来发出PUT请求。

const handleClick = (id) => {
    const newTasks = [...listItems];
    newTasks.map((task) => {
        if (task._id === id) {
            task.viewDetails = !task.viewDetails;
        }
    });
    setListItems(newTasks);
    axios.put(`http://localhost:5000/api/todos/${id}`, newTasks)
        .then(res => {
            console.log(res);
            console.log(res.data);
        })
        .catch(err => {
            console.log(err);
        })
}