Vue 离开页面时的校验-mixin-beforeRouteLeave

Posted leslie1943

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Vue 离开页面时的校验-mixin-beforeRouteLeave相关的知识,希望对你有一定的参考价值。

一定要看下函数前的注释, 需要在使用的页面定义【needCheckFlag】data属性

一定要看下函数前的注释, 需要在使用的页面定义【needCheckFlag】data属性

一定要看下函数前的注释, 需要在使用的页面定义【needCheckFlag】data属性

/**
 * what for: check when leave
 * how to use:
 * step-1: import routeLeaveCheck from ‘@/mixins/router/leave-check‘
 * step-2: mixins: [routeLeaveCheck],
 * step-3: ???
 *    define 【 needCheckFlag 】 in your own vue file(default value is true)
 *    sometime you dont‘ need checking when leave this page(click button, router-link etc..),
 *    you can change the value to be "false" before such kind operations
 */
export default {
  beforeRouteLeave(to, from, next) {
    if (this.needCheckFlag) {
      this.$confirm(‘确定离开此页面?‘, ‘提示‘, {
        confirmButtonText: ‘确定‘,
        cancelButtonText: ‘取消‘,
        type: ‘warning‘
      }).then(() => { 
        // some logic
        next() 
      })
        .catch(() => { next(false) })
    } else {
      next()
    }
  }
}

以上是关于Vue 离开页面时的校验-mixin-beforeRouteLeave的主要内容,如果未能解决你的问题,请参考以下文章