Html 单击事件时重新加载页面-React JS

我有一个按钮的

ButtonActor.js

：

import React from 'react';
import '../../css/index.css';
import '../../css/App.css';
import '../../css/bootstrap.min.css';
import '../../css/font-awesome.css';
import '../../css/floating-labels.css';
import Home from "../view/Home";
import { Route,  BrowserRouter as Router } from 'react-router-dom'
class ButtonActor extends React.Component {
    isPrimaryButton;
    hLink;

    constructor(props) {
        super(props);
        this.handleClick = this.handleClick.bind(this);
    }

    handleClick() {
        console.log("clicked");
    }


    render() {
        if(this.props.isPrimaryButton==="true")
        {
            return (
                <div>
                    <button className="btn btn-lg btn-primary btn-block btn-animated" type="submit">
                        {this.props.name}
                    </button>
                </div>
            );
        }
        else
        {
            return (
                <div>
                    <button className="btn btn-sm btn-secondary btn-block btn-animated" type="submit" onClick={this.handleClick}>
                        {this.props.name}
                    </button>
                </div>
            );
        }
    }
}
export default ButtonActor;

从“React”导入React；
导入“../css/index.css”；
导入“../css/App.css”；
导入“../css/bootstrap.min.css”；
导入“../css/font-awesome.css”；
导入“../css/floating labels.css”；
从“./视图/主视图”导入主视图；
从“react Router dom”导入{Route，BrowserRouter as Router}
类ButtonActor扩展React.Component{
isprimary按钮；
hLink；
建造师（道具）{
超级（道具）；
this.handleClick=this.handleClick.bind（this）；
}
handleClick（）{
控制台日志（“单击”）；
}
render（）{
if（this.props.isPrimaryButton==“true”）
{
返回(
{this.props.name}
);
}
其他的
{
返回(
{this.props.name}
);
}
}
}
导出默认按钮；

在Login.js中有以下代码：

  <div className="row justify-content-start">
                      <form className="form-signin">
                          <ButtonActor name="Don't Have An Account?" isPrimaryButton="false">
                          </ButtonActor>
                      </form>
                  </div>

每当我点击按钮时，此页面只需在末尾添加一个

？

标记即可重新加载当前页面

我如何解决这个问题

---

当它重新加载时，我甚至看不到它是否在控制台中打印。

通常不需要插入

表单

标记。在您的情况下，此错误与此相关，当您单击“提交”按钮时，它会提交表单并重新加载页面，但如果您需要使用此标记，并修复了此错误，您需要将onSubmit

eventListener

添加到表单标记中

  <div className="row justify-content-start">
       <form className="form-signin" onSubmit={(event) => event.preventDefault()}>
            <ButtonActor name="Don't Have An Account?" isPrimaryButton={false}>
            </ButtonActor>
       </form>
  </div>

---

在您的情况下，通常不需要插入

表单

标记，此错误与此相关，当您单击类型为submit的按钮时，它会提交表单，并重新加载页面，但如果您需要使用此标记并修复此错误，则需要将onSubmit

eventListener

添加到表单标记中

  <div className="row justify-content-start">
       <form className="form-signin" onSubmit={(event) => event.preventDefault()}>
            <ButtonActor name="Don't Have An Account?" isPrimaryButton={false}>
            </ButtonActor>
       </form>
  </div>

参观