阻止页面跳转/路由拦截

工作日常分享:今天有个需求,在离开这个页面的时候去执行一些按钮操作,但是跳转路由都是统一封装好的

实现方法:使用路由拦截进行拦截操作,就比如我离开这个页面的时候有系列操作需要执行,这时候就可以使用路由拦截beforeRouteLeave
在这里插入图片描述

 /*路由拦截*/ 
  beforeRouteLeave (to, from, next) {
    
    
  //to去往哪里
  //from当前路由
  在做完一系列操作后放行,需要使用next(),代表可以下一步
    this.$confirm('是否需要保存修改?', '提示', {
    
    
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    }).then(() => {
    
    
      this.Submit()
      next()
      setTimeout(() => {
    
    
        this.$router.push(to.path)
      },500) 
    }).catch(() => {
    
    
      next()      
      setTimeout(() => {
    
    
        this.$router.push(to.path)
      },500) 
    });
  },

其他工作日常分享:
统一输入框只能输入数字且不能小于1
使用循环总是拿到最后的值
将参数或者数据当做属性使用
el-form 动态控制rules是否校验
vue 实现只有中评好评差评功能
饿了么ui自定义表头内容

猜你喜欢

转载自blog.csdn.net/xiaokangna/article/details/126145470