Vue 页面切换时弹出确认框

Vue iView JavaScript 大约 551 字

需求

Vue页面退出或切换前弹出确认框,提示是否离开。

实现

页面使用iView框架,添加beforeRouteLeave即可。

export default {
    name: "page",
    data() {
        return {}
    },
    methods: {},
    beforeRouteLeave (to, from, next) {
        this.$Modal.confirm({
          content:'内容还未保存,是否离开?',
          title:'提示',
          okText: '离开',
          cancelText: '取消',
          onOk: function () {
            // 正常跳转
            next()
          },
          onCancel: function () {
            // 如果取消跳转地址栏会变化,这时保持地址栏不变
            window.history.go(1)
          }
        });
    }
}
阅读 903 · 发布于 2020-11-24

————        END        ————

扫描下方二维码关注公众号和小程序↓↓↓

扫描二维码关注我
昵称:
随便看看 换一批