javascript - Axios.put ReactJS

Question

它有点工作，但问题是它复制正在更新的文件并将其放在页面的末尾，我正在尝试对项目进行显示更新

这就是我想要做的

    submitEdit = (id, value) => {
    let {todos} = this.state
    todos.map((item => {
        if (item._id === id) {
            axios
                .put(`http://localhost:8080/edit/${id}`, {
                    todo: value,
                })
                .then((res) => {
                    this.setState({
                        todos:[...todos,{todo:value}]
                    })
                    console.log("res", res);
                })
                .catch((err) => {
                    console.log("err", err);
                });
        }
    }))
}

除此之外一切正常

Answer 1

需要使用索引来更新状态，这样todo元素才会被更新，而不是被复制并添加到最后

您可以使用 Array.prototype.slice与 spread syntax要做到这一点

todos.map(((item, i) => {
    if (item._id === id) {
        axios
            .put(`http://localhost:8080/edit/${id}`, {
                todo: value,
            })
            .then((res) => {
                this.setState({
                    todos:[...todos.slice(0, i),{todo:value}, ...todos.slice(i + 1)]
                })
                console.log("res", res);
            })
            .catch((err) => {
                console.log("err", err);
            });
    }
}))