javascript - 将动态的onChange监听器传递给子级

我有一个有状态的组件，拥有一些状态state={ name:'', age:'', occupation:''}和一个用于更新状态onChange侦听器的函数onValueChange = (key, event) => { this.setState({ [key]: event.target.value });};我把状态传给孩子作为道具在组件B的内部（它是A的子代），我想以编程方式基于给定的道具创建输入，并通过在用户每次输入输入时调用该函数来更改状态。<ComponentB>{ Object.entries(this.props) .filter( prop => prop[0] !== 'changed' ) .map(propName => ( <Input key={propName} label={propName[0]} value={propName[1]} onValueChange={this.props.changed(propName[0])} /> ))} </ComponentB>我的输入组件仅呈现以下内容 <input onChange={this.props.onValueChange} value={this.props.value} type={this.props.type} placeholder="&nbsp;" />由于某种原因无法使其正常工作。谢谢你的帮助！ 最佳答案 您当前正在通过编写this.props.changed直接在渲染上调用onValueChange={this.props.changed(propName[0])}。与其在render上调用它，不如在onValueChange出现时给它一个函数调用。您还想给Input一个独特的key道具，该道具在状态更新之间不会改变，以便React不会每次都创建一个全新的组件，例如失去input的注意力。您可以改用propName[0]，这将是唯一的。<Input key={propName[0]} label={propName[0]} value={propName[1]} onValueChange={event => this.props.changed(propName[0], event)}/>关于javascript - 将动态的onChange监听器传递给子级，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/51767962/