React JS:history.push 不是函数错误,它没有导航到不同的页面 onclick of swal

新手上路,请多包涵

在过去的几个月里,我一直在使用 React js,并且刚刚了解了用于 React 的 sweetalert bootstrap 插件。成功更新组件后,屏幕上会出现一个对话框。单击“单击此处”按钮后 history.push 被调用,它应该路由到不同的页面,但我一直收到错误消息

history.push 未定义。

我已经用谷歌搜索了很多东西并尝试了很多场景但没有成功。

代码片段:

 class displayBlank extends Component {

render(){

<div id="displayDetails">
          <DisplayDetails respData={this.state.respData}  />
        </div>

}

}

export default displayBlank;

class displayDetails{

 handleUpdate()
 {

  // Body of HandleUpdate
    swal({
      title :"Customer Updated Successfully!",
      icon : "success",
      button: "Click Here!",
    }).then((e) => { history.push('/blank');
  });

  }

  render(){

  <table>
  <tr>
  <td>

   Table-Grid Contents
  </td>
  </tr>
  </table>

  <td>
              <FormGroup controlId="formControlsDisabledButton"  style={buttonalignment}>
                <Button className="float-right" bsStyle="primary" type="submit" onClick={this.handleUpdate}>Save</Button>
                {'  '}
                <Button className="float-right" bsStyle="primary" type="submit" disabled>Download</Button>
                {'  '}
              </FormGroup>
            </td>

  }

}

原文由 Ice_Queen 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 370
2 个回答

如果您使用的是 react-router ,请使用 this.props.history.push('<url>')

如果您遇到 Cannot read property 'push' of undefined 错误,请将组件包装在 withRouter 中:

 import { withRouter } from 'react-router';

class DisplayBlank extends Component {
  ...
}

export default withRouter(DisplayBank);

原文由 Nino Filiu 发布,翻译遵循 CC BY-SA 4.0 许可协议

您好,如果您遇到以下问题

history.push 反应 js 试试这个

 import { useNavigate } from "react-router-dom";
        const history= useNavigate();

   history("/path");

原文由 Muhammad Awais 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题