VUE返回上一层时对当前逻辑判断

2020-01-16 14:39:51

在移动端VUE项目中,默认有返回上一层的功能,例如安卓手机的左上角返回按钮。

当我们需要在返回上一级之前进行某些函数判断时,可以借助beforeRouteLeave 进行判断。

 具体作法:


beforeRouteLeave(to,from,next) {
 
       if (this.btnColorChange==false){
          MessageBox.confirm('',{
                   title:'确定要退出调查?退出将不保存答题记录',
                    cancelButtonText:'暂不',
                     confirmButtonText:'退出'
               })
               .then(action=>{
                   //退出
                  //  this.$router.push('/surveytest')
                  next()
               })
       }else {
         next()
       }
     		   
		    
     	},

这样就实现了在移动端退出当前页面返回上一级的时候进行了判断。其中的next()指向的就是判断执行后的上一级。



  • 2020-01-04 08:19:28

    flex 布局子内容p元素被撑开

    父元素 flex 布局,子元素有一行文字,将其设置为不换行隐藏后显示省略号,但实际并不是想象的那样,而导致布局变形。改怎么办?

  • 2020-01-04 18:44:26

    vue中computed源码,工作原理

    (Obeject.defineProperty是Object的一个方法,第一个参数是对象名称,第二个参数是要设置的属性名,第三个参数是一个对象,它可以设置这个属性是否可修改、可写等,而这篇文章主要使用的是Obeject.defineProperty的访问器属性,感兴趣的朋友可以自行google或者查看Js高及程序设计)

  • 2020-01-06 23:02:42

    Updating Homebrew... 更新了镜像依然卡死

    使用brew install [软件包]安装软件包时,卡在Updating Homebrew... 或输入`brew update`更新brew,半天没反应.产生原因一般是在国内访问官方 更新源获取资源太慢,解决方案可以采用更换国内镜像更新源.

  • 2020-01-07 10:06:00

    vue重定向beforeRouterEnter与replace的使用

    一个登录页面,只有第一次才会出现,一旦出现过,以后再也不会出现,即使是输入该页面的url也不会跳转到该页面,只会跳转到指定的其他页面;

  • 2020-01-07 10:14:07

    vue强制刷新组件 销毁和重建

    很多时候,通过重置数据将页面重置时,子组件可以提供重置的方法,或者提供props重置自己的状态。但是相对麻烦,那可以使用强制刷新来实现刷新组件。

  • 2020-01-07 10:17:42

    vue钩子函数beforeRouteUpdate没有反应

    由于会渲染同样的 Foo 组件,因此组件实例会被复用。而这个钩子就会在这个情况下被调用。 可以访问组件实例 `this`