问答

umiJS Prompt react antD 如何监听页面跳转变化?(实现防止页面

作者:admin 2021-09-18 我要评论

如题. 现需要监听页面跳转(a链接),给出"是否放弃编辑,离开当前页面?"的提示. 如使用 umiJS Prompt ,如下组件是如何与页面的a链接关联的 ? import Prompt from 'u...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

如题.
现需要监听页面跳转(a链接),给出"是否放弃编辑,离开当前页面?"的提示.

如使用 umiJS Prompt ,如下组件是如何与页面的a链接关联的 ?

import Prompt from 'umi/prompt';

export default () => {
  return (
    <>
      <h1>Prompt</h1>
      <Prompt
        when={true}
        message={(location) => {
          return window.confirm(`confirm to leave to ${location.pathname}?`);
        }}
      />
    </>
  );
}
###

看你选择的路由方案,假设你使用的是history来切路由,那实现的代码可能如下:

    constructor(props) {
        super(props);

        this.unblock = history.block((location, action) => {
          if (this.state.isDirty) {
            return `confirm to leave to ${location.pathname}?`;
          }
        });
    }

具体参考文档:https://github.com/ReactTrain...

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • umiJS Prompt  react antD 如何监听页

    umiJS Prompt react antD 如何监听页

  • fillStyle 一直显示黑色,传入的颜色变

    fillStyle 一直显示黑色,传入的颜色变

  • element的表格不能翻页

    element的表格不能翻页

  • mac brew services

    mac brew services

腾讯云代理商
海外云服务器