Javascript 调用父函数-React Js的子组件上的event.preventDefault

我不是在解释我的整个代码结构。这是我目前的情况。我已将一个方法添加到父组件中的子组件：

<TableRow obj={object} key={i} delteMethod={that.deleteRow} />

deleteRow(deleteid) {
      var that = this;
      deleteItem(deleteid).then(function(data){
        that.loadData();
      });
    }

---

这很有效。我能够在父组件中获取obj.id，并且我正在执行其余的任务。我想做的是，我想添加一个event.preventDefault（）函数到“Delete”按钮（我说的子组件按钮已经可以正常工作了）。如何实现这一点？

您可以在子组件中定义一个函数，该函数将接收

事件

，并从

道具

调用父组件的函数。以下是子组件的示例代码：

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>);
}

构造函数（道具）{
超级（道具）；
this.onDeleteClick=this.onDeleteClick.bind（this）；
}
单击（事件）{
event.preventDefault（）；
this.props.delteMethod（this.props.obj.id）；
}
render（）{
返回（）；
}

您可以在组件类中使用如下的click handler函数

clickHandler = (e) => {
  this.props.delteMethod(this.props.obj.id);
  e.preventDefault();
}    

在按钮上，你可以像

<a href="#" onClick={this.clickHandler}>Delete</a>

---

完美。非常感谢。

<a href="#" onClick={this.clickHandler}>Delete</a>