编辑功能未在React中保存对状态数据的更改

Question

我正在尝试在网页中提供用于编辑状态数据的功能。

这里是状态结构

state = {
  eventList:[
    {
       name: "Coachella"
       list: [
          {
             id: 1,
             name: "Eminem"
             type: "rap"
          }
          {
             id: 2,
             name: "Kendrick Lamar"
             type: "rap"
          }
       ]
    }
  ]
}

我希望能够编辑列表数组，尤其是id，name和type属性，但是我的函数似乎无法对其进行编辑？我目前正在传递要在变量eventData和ID值中覆盖ID名称和类型的数据，该ID值指定在输出状态数据的表中选择了哪一行。

这里是功能代码：

editPickEvent = (eventData, id) => {
     const eventListNew = this.state.eventList;
     eventListNew.map((event) => {
       event.list.map((single) => {
         if (single.id == id) {
           single = eventData;
         }
       });
     });
     this.setState({
       eventList: eventListNew,
     });
   };

当我运行代码时，该函数不会更改单个map变量，而且我似乎无法查明原因。任何帮助都会很棒

编辑：

实施Mhmdrz_A上尉的解决方案

editPickEvent = (eventData, id) => {
 const eventListNew = this.state.eventList.map((event) => {
   event.list.map((single) => {
     if (single.id == id) {
       single = eventData;
     }
   });
 });
 this.setState({
   eventList: eventListNew,
 });

};

我收到一个新错误，说无法读取另一个使用map函数将状态数据呈现到表的文件中未定义的属性列表？

这是导致错误的另一个文件的一部分：

render() {
const EventsList = this.props.eventList.map((event) => {
  return event.list.map((single) => {
    return (

Answer 1

map()每次都返回一个新数组，但是您没有将其分配给任何东西；

editPickEvent = (eventData, id) => {
     const eventListNew = this.state.eventList.map((event) => {
       event.list.map((single) => {
         if (single.id == id) {
           single = eventData;
         }
       });
     });
     this.setState({
       eventList: eventListNew,
     });
   };