Vue 页面切换时弹出确认框

Vue iView JavaScript About 551 words

需求

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)
          }
        });
    }
}
Views: 4,195 · Posted: 2020-11-24

————        END        ————

Give me a Star, Thanks:)

https://github.com/fendoudebb/LiteNote

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

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


Today On History
Browsing Refresh