如何将单个组件道具转换为Top Component？

Question

上图，<NavTop />组件有doLogout()，

class NavTop extends Component{
    doLogout(){
        _user.logout().then((res) => {
            this.props.history.push('/login')
        })
    }
}

然后注销成功，位置没有重定向＆＃34; / login＆＃34;，但我得到了未定义，this.props.history is undefined。 如果我使用this.props.history.push()重定向＆＃34; / login＆＃34;，如何解决＆＃34;道具＆＃34;并温和地重定向＆＃34; / login＆＃34;？

现在我使用window.location.href = '/login'，我认为这种方式是暴力吗？ 那你有别的方法吗？请帮我！感谢!!!

Answer 1

您必须将组件包装在withRouter HOC中以使用历史属性。

import { withRouter } from 'react-router-dom';

...

class NavTop extends Component{
    doLogout(){
        _user.logout().then(() => this.props.history.push('/login'))
    }
}

export default withRouter(NavTop);