开发者问题收集

我无法在 ReactJS 中正确使用 history.push()

2019-09-03
985

我是 ReactJS 的新手,我尝试使用 history.push() 重定向页面,但没有成功。有人能帮我指出我的代码出了什么问题吗?我知道可以使用 React Router,但它对我想做的事情没有帮助。

import React from 'react';

class App extends React.Component {

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

    handleClick(e) {
        e.preventDefault()
        this.props.history.push('/redirected');
    }

    render() {
        return (
            <div>
                <button onClick={this.handleClick}>
                    Redirect!!!
                </button>
            </div>
        )
    }
}

export default App; 

单击按钮后,我收到以下错误:

TypeError: Cannot read property 'push' of undefined

在线:

this.props.history.push('/redirected');

谢谢!

3个回答

最简单的解决方案是:

安装历史记录:

npm install --save history

在 index.js 中初始化浏览器历史记录:

import { createBrowserHistory } from 'history';

export const browserHistory = createBrowserHistory();

使用:

browserHistory.push('/pathToRedirect')
Jackkobec
2019-09-03

如果重定向到外部链接,请尝试以下操作:

window.location.href = 'your-url';

尽管我必须警告您,如果重定向到外部链接,react-router 将无法按您希望的方式工作。

Rohit Kashyap
2019-09-03

试试这个,它对我有用。

props.history.push('/signup', {...props})
Kai Yamato Asakura
2022-02-17