我希望我的ReactJS应用程序在导航离开特定页面时通知用户。特别是弹出消息,提醒他/她做一个动作:
“Changes are saved,but not published yet. Do that now?”
我应该在react-router上全局触发这个,还是可以从react页面/组件中做到这一点?
我没有在后者身上找到任何东西,我宁愿避开第一个。除非它当然是标准,但这让我想知道如何做这样的事情,而不必将代码添加到用户可以去的每个其他可能的页面..
欢迎任何见解,谢谢!
对于react-router 2.4.0
注意:建议将所有代码迁移到最新的react-router
以获取所有新的好东西。
按照react-router documentation的建议:
应该使用withRouter更高阶组件:
We think this new HoC is nicer and easier,and will be using it in
documentation and examples,but it is not a hard requirement to
switch.
作为文档中的ES6示例:
import React from 'react' import { withRouter } from 'react-router' const Page = React.createClass({ componentDidMount() { this.props.router.setRouteLeaveHook(this.props.route,() => { if (this.state.unsaved) return 'You have unsaved information,are you sure you want to leave this page?' }) } render() { return <div>Stuff</div> } }) export default withRouter(Page)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。