使用react-router setRouteLeaveHook的钩子函数

今天在使用react-router setRouteLeaveHook的钩子函数,不知道怎么实验就是成功。最后功夫不负有心人,终于让我找到使用setRouteLeaveHook的方法了

1、我在网络上找到关于如何使用的方法,

 componentDidMount(){
        this.props.router.setRouteLeaveHook(
            this.props.route,
            this.routerWillLeave
        )
    }

routerWillLeave=(nextLocation)=>{
            return '确认要离开?';
    }

  但是,欧额,要报错

无法找到props里面的router,

废了很大的劲,终于找到问题所在,

原因:

缺少react-router的 withRouter方法加工一下组件,所以找不到props里面的router

解决办法:

  1、在组件头部引入react-router模块,要导入withRouter

import { withRouter } from 'react-router'

  2、在导出组件的时候,通过withRouter方法对组件进行加工

export default withRouter(Login)

  代码编译好之后,重新进入到页面,路由跳转就会出现提示

posted @ 2017-06-29 19:25  公主他爸  阅读(7270)  评论(3编辑  收藏  举报