前端开发那些事儿大前端vue

vue-router beforeRouteLeave 引发的问

2020-10-22  本文已影响0人  冷r

用户需求是当用户在创建商品时,点击了左侧菜单,做一个离开提醒‘是否确定离开?’。
如下实现:
但是,出现一个问题:用户点击左上角浏览器回退按钮时,这个弹出提醒就会闪现,立马消失。
方法一
路由换成history
方法二

 beforeRouteLeave(to: any, from: any, next: any) {
    if (from.name === 'orderCreateStep2') {
      setTimeout(() => {
        this.$confirm('是否放弃创建该订单?', '提示', {
          confirmButtonText: '是',
          cancelButtonText: '否'
        })
          .then(() => {
            localStorage.removeItem('refundOrderInfo')
            next()
          })
          .catch(() => {
            next(false)
          })
      }, 200)
    } else {
      next()
    }
  }
上一篇下一篇

猜你喜欢

热点阅读