React路由器为组件提供历史支持。

您可以替换链接并在按钮中包含一个onclick。

<div className="flexBox">
    <h4>Rampa de Cores</h4>
    <CustomButton 
      onClick={() => this.props.history.push('/new')} 
      label="Adicionar" 
      className={"addButton"}
    />
</div>

不应将按钮用作链接的子级。相反,您可以使用按钮并在单击按钮时触发状态更改或重定向。如果新路由是用react router dom的路由声明的,则可以使用以下代码:

 <div className="flexBox">
        <h4>Rampa de Cores</h4>
        <Link to={"/new"} className="link">
            <CustomButton label="Adicionar" className={"addButton"}
onButtonClick={()=>this.props.history.push('/new')}/>
        </Link>
</div>
  <button
 onClick={this.props.onButtonClick}
>{this.props.label}</button>

如果当前组件没有用路由定义,则必须使用 withRouter 从 react-router-dom 访问历史属性。

您可以使用下面的flex box样式,或者简单地制作。链接显示:块;宽度:100%;

.link{
    display:flex;
    flex-flow:row wrap;
    flex-basis:50%;
    min-width:50%;
    line-height:normal;
}

就高度而言,如果parent.flexbox display属性为flex,则高度将自动拾取。