useEffect(() => {

//這里要緩存函數(shù)返回的方法，返回的函數(shù)是解除限制函數(shù)，想解除直接調(diào)用一下
    unblockRef.current = history.block((tx, action) => {
      setTargetPathname(tx.pathname)//緩存目標(biāo)路徑    之所以緩存，是為了彈框點擊確認的時候可以獲取到
      const isBlock = history.location.pathname != tx.pathname//當(dāng)跳轉(zhuǎn)的目標(biāo)地址不是當(dāng)前地址，則攔截，只要不在當(dāng)前頁面就攔截
      setOpen(isBlock)
      return isBlock == true ? false : true ////返回false是阻塞， 返回true是不阻塞   注意這里和block的值正好相反
    })
    return () => {
      unblockRef.current()//  組件卸載之后要解除限制
    }
  }, [history])

<dialog className="dialog" open={open}>
  <p>確認離開么<br /></p>
  <button onClick={cancel}>取消</button>
  <button onClick={handleConfirm}>確定</button>
</dialog>

  const handleConfirm = () => {
    setOpen(false)
    if (unblockRef.current) {
      unblockRef.current();//釋放限制
    }
    history.push(targetPathname)//從新跳轉(zhuǎn)之前要跳轉(zhuǎn)的頁面
  }

   <Prompt when={isBlock} message={(location) => {
     

      if (location.pathname !== history.location.pathname) {
        setTargetPathname(location.pathname)
        setIsBlock(true)
        setOpen(true)
        return false//返回false是攔截
      } else {
        setIsBlock(false)
        return true//true是放行
      }
    }}></Prompt>

  const handleConfirm = () => {

    setIsBlock(false)
    setOpen(false)

    //需要等待鎖釋放之后才能跳轉(zhuǎn)
    setTimeout(() => {

      history.push(targetPathname)//從新跳轉(zhuǎn)之前要跳轉(zhuǎn)的頁面
      console.log('確認')
    }, 100)
  }

  const cancel = () => {
    setOpen(false)
  }

  <Prompt when={isBlock} message={'自定義---確定你要返回么?。。。?！'}></Prompt>

  <Router

     getUserConfirmation={(message, callback) => {
       callbackRef.current = callback
       setMessage(message)
       setOpen(true)
     }
     }
   >

  const handleConfirm = () => {
    setOpen(false)
    callbackRef.current?.(true)
  }

  const cancel = () => {
    callbackRef.current?.(false)
    setOpen(false)
  }