通过对象ID更新状态数组

Question

我想通过特定ID更新状态数组对象。

假设我的下列对象处于状态。而且我尝试通过以下方式使用id进行更新，但这对我不起作用。

它没有更新状态数据。

this.state = {
      data: [{id:'124',name:'qqq'}, 
           {id:'589',name:'www'}, 
           {id:'45',name:'eee'},
           {id:'567',name:'rrr'}]
}

publishCurrentProject = user => {
  this.setState(prevState => ({
        data: prevState.data.map(item =>
          item.id === user.id ? { ...user } : item
        ),
  }))
}

let user = {id:'124',name:'ttt'};

publishCurrentProject(user);

任何帮助将不胜感激。

Answer 1

也许问题出在如何调用publishCurrentProject()上，也许是您将该函数放在了错误的上下文中。我使用了您的实现，它仍然有效

export default class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: [
        { id: "124", name: "qqq" },
        { id: "589", name: "www" },
        { id: "45", name: "eee" },
        { id: "567", name: "rrr" }
      ]
    };

    this.handleClick = this.handleClick.bind(this);
    this.publishCurrentProject = this.publishCurrentProject.bind(this);
  }

  handleClick(e) {
    let user = { id: "124", name: "ttt" };

    this.publishCurrentProject(user);
  }

  publishCurrentProject(user) {
    this.setState((prevState) => ({
      data: prevState.data.map((item) =>
        item.id === user.id ? { ...user } : item
      )
    }));
  }

  render() {
    return (
      <div className="App">
        <h1>Test</h1>
        {this.state.data.map((el) => (
          <p>{el.name}</p>
        ))}
        <button onClick={this.handleClick}>Change</button>
      </div>
    );
  }
}

示例代码和框