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

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/qq_42894622/article/details/89419176

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()函数,让路由跳转到下个路由,否则路由跳转失效
    
    }
    
展开阅读全文

没有更多推荐了,返回首页