Question

我想以编程方式点击我的“提交”按钮，所以我做了一个裁判

constructor(props) {
  super(props);
  this.formSubmit = React.createRef();
}

  <form
    ref={this.formSubmit}
    onSubmit={this.searchClick}
  />

this.formSubmit .current.submit(new Event('submit'));

所以我的表单确实提交了，但是页面也刷新了，所以我猜我的

  event.preventDefault();
  event.stopPropagation();

没有运行。

Answer 1

https://reactjs.org/docs/handling-events.html

尝试一下：

 <form
 ref={this.formSubmit}
 onSubmit={(e) => e.preventDefault() & this.searchClick}
/>

Answer 2

您也可以在event.preventDefault();中致电searchClick

Answer 3

以表单提交的默认行为是发送有效载荷并将页面重定向到实际提到的位置。但是由于没有动作，它将刷新页面。这是浏览器的默认行为。要取消此操作，应调用preventDefault。

检查事件在您的searchClick中是否可用，然后调用它。

searchClick(e){
    e.preventDefault();
    //do stuff here
}

编辑：https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault了解更多

使用Ref触发OnSubmit（）-如何传递事件？

3 个答案: