反应-防止表单提交

小编典典

反应-防止表单提交

reactjs

我一直在尝试React。在我的实验中，我正在使用Reactstrap框架。当我单击按钮时，我注意到HTML表单已提交。有没有一种方法可以防止单击按钮时提交表单？

我在这里重新创建了我的问题。我的表单很基本，看起来像这样：

<Form>
  <h3>Buttons</h3> 
  <p>
    <Button color="primary" onClick={this.onTestClick}>primary</Button>&nbsp;
  </p>
</Form>

我想念什么？

阅读 226

2020-07-22

共1个答案

小编典典

我认为首先要注意的是，如果没有javascript（纯HTML），则form在单击<input type="submit" value="submit form">或时会提交元素<button>submits form too</button>。在javascript中，您可以通过使用事件处理程序并调用e.preventDefault()按钮单击或表单提交来防止这种情况发生。e是传递给事件处理程序的事件对象。通过react，两个相关的事件处理程序可以通过as形式使用onSubmit，另一个通过可以在按钮上使用onClick。

示例：http：//jsbin.com/vowuley/edit？html，js，console，output

2020-07-22