Javascript 使用目标名称和值从映射中响应、状态更新函数

我正在尝试更新状态，当前func（handleLabelChange）理论上是有效的（更新状态），但我想从textarea字段或任何其他字段动态添加名称，而不是textOne和值“？”。某种类型的target.name和target.value，但我不知道如何处理它

handleLabelChange = id => {
const updatedItems = this.state.items.map(item => {
  if (item.id === id) {
    return {
      ...item,
      textOne: "????"  // grab textarea name and value here 
    };
  } else {
    return item;
  }
});

this.setState({
  items: updatedItems
});

})

JSX内部映射函数：

{this.state.items.map(el => (

<textarea rows="5" placeholder="Text here..." name="textOne" onChange={() => this.handleLabelChange(el.id)}></textarea>

}

{this.state.items.map（el=>(
this.handleLabelChange（el.id）}>
}

我会在文本区域执行类似操作：

onChange={this.handleLabelChange(el.id, 'name')}

其中第二个参数是属性，handleLabelChange如下所示

function handleLabelChange(id, property) {
  return ev => {
    const newVal = ev.target.value;

    const updatedItems = this.state.items.map(item => {
      if (item.id === id) {
        const newItem = Object.assign({}, item);
        newItem[property] = newVal;
        return newItem;
      } else {
        return item;
      }
    });

    this.setState({
      items: updatedItems
    });
  }
}

---

handleLabelChange返回回调函数，而不是回调函数

我会在文本区域执行类似操作：

onChange={this.handleLabelChange(el.id, 'name')}

其中第二个参数是属性，handleLabelChange如下所示

function handleLabelChange(id, property) {
  return ev => {
    const newVal = ev.target.value;

    const updatedItems = this.state.items.map(item => {
      if (item.id === id) {
        const newItem = Object.assign({}, item);
        newItem[property] = newVal;
        return newItem;
      } else {
        return item;
      }
    });

    this.setState({
      items: updatedItems
    });
  }
}

---

handleLabelChange返回回调函数，而不是回调函数

最终我能够解决它，如果有人有类似的问题，那就是我的解决方案

正如TKoL建议的函数需要args:id、name、value、（{target:{id、value、name}}），那么在我的例子中，我需要将id从string更改为number

handleLabelChange = ({target: {id, value, name}}) => {
const idToNumber = Number(id);
const updatedItems = this.state.items.map(item => {
  if (item.id === idToNumber) {
    return {
      ...item,
      [name]: value
    };
  } else {
    return item;
  }
});

this.setState({
  items: updatedItems
});
}

JSX

{this.state.items.map（el=>(
}

最终我能够解决它，如果有人有类似的问题，那就是我的解决方案

正如TKoL建议的函数需要args:id、name、value、（{target:{id、value、name}}），那么在我的例子中，我需要将id从string更改为number

handleLabelChange = ({target: {id, value, name}}) => {
const idToNumber = Number(id);
const updatedItems = this.state.items.map(item => {
  if (item.id === idToNumber) {
    return {
      ...item,
      [name]: value
    };
  } else {
    return item;
  }
});

this.setState({
  items: updatedItems
});
}

JSX

{this.state.items.map（el=>(
}