我花了一整天的时间尝试了各种方法，但都是徒劳。我正在学习 React 如何使工作成为删除功能，但随后却徒劳无功。 一个简单的待办事项列表，其中删除不起作用。我不知道我哪里做错了。
这里是js文件:display和addList，这是display的父文件。使用 props 父函数不会被调用。
显示.js
class DisplayList extends Component{
delRow(en){
this.props.delItemRow(en);
}
render(){
return(
// console.log("check"+this.props.list),
<div>
<h4>DisplayList</h4>
<ul>
{this.props.list.map((item)=>(<li key={item}>{item} <button onClick={this.delRow.bind(this,item)}>D</button> </li>))}
</ul>
</div>
);} }
export default DisplayList;
addlist.js
class AdList extends Component{
constructor(props){
super(props);
this.state={value:'',disArrList:[]}
this.handleChange=this.handleChange.bind(this);
this.handleSubmit=this.handleSubmit.bind(this);
this.delItemRow=this.delItemRow.bind(this);
this.updateItemRow=this.updateItemRow.bind(this);
}
delItemRow(itemName)
{this.setState({disArrList:this.state.disArrList.filter(e1=>e1!==itemName)};
}
handleChange(e){
this.setState({value:e.target.value});
}
handleSubmit(e){
e.preventDefault();
//alert("submit"+this.state.value);
let mycolletion=this.state.disArrList.concat(this.state.value);
this.setState({disArrList:mycolletion});
}
render(){
return(
<div>
<div className="Todo">
<form onSubmit={this.handleSubmit}>
<input type="text" value={this.state.value} onChange={this.handleChange}/>
<input type="submit" value="Add" />
</form>
</div>
<div>
<DisplayList list={this.state.disArrList} removeItem={this.delItemRow} updateItem={this.updateItemRow}/>
</div>
</div>
);}}
export default AdList;
谢谢您的帮助，我们将不胜感激
最佳答案
您传递的 Prop 称为removeItem，因此您必须在代码片段中更改它。
display.js
delRow(en){
this.props.removeItem(en);
}
render(){
return(
<div>
<ul>
{this.props.list.map((item)=>(<li key={item}>{item} <button onClick={this.delRow.bind(this,item)}>D</button> </li>))}
</ul>
</div>
);
}
关于node.js - TypeError : this. props.delItemRow 不是删除项目的函数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51917907/