我并没有解释我的整个代码结构。这是我目前的情况。我在父组件内的子组件中添加了一个方法:
<TableRow obj={object} key={i} delteMethod={that.deleteRow} />
我的子组件定义如下:
<a href="#" onClick={this.props.delteMethod.bind(this, this.props.obj.id)}>Delete</a>
这是我在父组件中的 deleteRow() 函数:
deleteRow(deleteid) {
var that = this;
deleteItem(deleteid).then(function(data){
that.loadData();
});
}
这行得通。我能够在我的父组件中取回 obj.id,并且我正在完成其余的任务。我想做的是,我想向“删除”按钮单击添加一个 event.preventDefault() 函数(我说的子组件按钮已经可以正常工作)。如何实现?
最佳答案
您可以在您的子组件中定义一个函数,该函数将接收 event
并从 props
调用您父组件的函数。以下是您的子组件的示例代码:
constructor(props) {
super(props);
this.onDeleteClick = this.onDeleteClick.bind(this);
}
onDeleteClick(event) {
event.preventDefault();
this.props.delteMethod(this.props.obj.id);
}
render() {
return (<a href="#" onClick={this.onDeleteClick}>Delete</a>);
}
关于javascript - 调用父函数的子组件上的 event.preventDefault - React Js,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48241990/