React.js:页面在Button的onClick句柄上刷新吗? [英] Reactjs: page refreshing upon `onClick` handle of Button?

问题描述

我的 render()(这是一个Bootstrap按钮)中有以下块:

I have the following block inside my render() (which is a Bootstrap Button: https://react-bootstrap.github.io/components.html#buttons-options):

<Button type="simpleQuery" onClick={this.handleEntailmentRequest.bind(this)}>
   Query
</Button>

和以下功能:

handleEntailmentRequest() {
    console.log("handle request ");
}

每当我单击按钮时，我都可以看到处理请求"问题出现在控制台日志中，但突然消失.我的理解是某些原因导致页面刷新.有什么意见我要去哪里吗?

Whenever I click on the button I can see that the "handle request" question appears in the console log, but suddenly disappears. My understanding is that something is causing the page to refresh. Any opinons where I am going wrong?

推荐答案

默认按钮操作是提交表单.

The default button action is to submit the form.

如果不需要-您需要防止这种情况:

If you don't need that - you need to prevent that:

handleEntailmentRequest(e) {
    e.preventDefault();

    console.log("handle request ");
}

参考文献:

• MDN- Event.preventDefault()

这篇关于React.js:页面在Button的onClick句柄上刷新吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！