vue-router部分有效,部分失效问题

12 篇文章 1 订阅

个人blog,欢迎关注加收藏

vue-router失效

项目:H5绣红旗
框架:vue + vue-router
***查看是否代码中存在路由钩子函数,而钩子函数中未写next()***;
  • 部分路由跳转有效:

    p_demo.addEventListener("touchend", function (e){            /*触摸结束*/
                console.log("触摸结束")
                // console.log(e)
                _this.num = _this.start - _this.move ;   /*得出开始和结束距离页面顶部的差值*/
                console.log(_this.num)     /*得出触屏结束后距离页面顶部的距离*/
                if(_this.num>15){
                    console.log('跳转到下一页');
                    _this.$router.push({//跳转到热力图页:    跳转有效
                        'path':'/statistics'
                    });
                    
                }else{//首页 往上不跳转
                    console.log('不跳转');
                }
    
        })
    
    • 部分路由跳转失效:
    p_demo.addEventListener("touchend", function (e){            /*触摸结束*/
                console.log("触摸结束")
                // console.log(e)
                _this.num = _this.start - _this.move ;   /*得出开始和结束距离页面顶部的差值*/
                console.log(_this.num)     /*得出触屏结束后距离页面顶部的距离*/
                if(_this.num>15){
                    console.log('下一页','>15');
                    _this.$router.push({//跳转到首页:只写这个跳转失效,包括浏览器的后退按钮也失效,需要重新刷新整个项目
                        'path':'/'
                    });
                }else{//往上
                    console.log('上一页','<=15');
                    _this.$router.push({//跳转到首页:只写这个跳转失效,包括浏览器的后退按钮也失效,需要重新刷新整个项目
                        'path':'/'
                    });
                }
    
        })
    
    beforeRouteLeave(to,from,next){
      console.log('离开路由');
    	next();//注意!!!使用路由钩子函数时,一定要要加上next()函数,让路由跳转到下个路由,否则路由跳转失效
    
    }
    
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值