vue 在axios中使用路由跳转并传参，报Cannot read property '$router' of undefined

最新推荐文章于 2024-03-09 14:17:14 发布

七侠剑客

最新推荐文章于 2024-03-09 14:17:14 发布

阅读量1.2w

点赞数 5

分类专栏： Vue 文章标签： vue axios 路由跳转

本文链接：https://blog.csdn.net/qq_36727756/article/details/90411606

版权

Vue 专栏收录该内容

25 篇文章 1 订阅

订阅专栏

在用vue开发项目时，需要经A页面的参数以及页面中axios返回的参数传递到B页面，直接上代码吧(简单写了)：

data() {
			return {
				imageUrl: require("../../static/tianjia.png"),
				dateValue1: "2018-09-08",
				dateValue2: "2018-09-10",
				}
	}
methods: {
	//通过这个方法去进行路由跳转以及传参
	 handleClick(row){
                var me=this;
                var features;        
                me.axios.get(
                    'personnelface/common/featurebyurl?face_img_url='+row.face_img_url)
                    .then(function(response){
                    if(response.data.code==0){                     
                        features=response.data.msg.feature;     
                        this.$router.push({ path: '/App/FootholdAnalysis', query:{ imageUrl:row.face_img_url, dateValue1: this.dateValue1, dateValue2:this.dateValue2,features:features}}); 
                        $('.FrequencyAnalysis').removeClass('analysisButtonActive');  
                        $('.FootholdAnalysis').addClass('analysisButtonActive');                        
                    }
                })
                .catch(function (error) {
						console.log(error);
                    });                   
            }
}

但是上述写法，报错Cannot read property ‘$router’ of undefined，通过debugger追踪发现下面代码中this显示未定义，在上述代码中，定义this用错：

this.$router.push({ path: '/App/FootholdAnalysis', query:{ imageUrl:row.face_img_url, dateValue1: this.dateValue1, dateValue2:this.dateValue2,features:features}});

对上述代码进行修改：

 handleClick(row){
                var me=this;
                var features;
                this.axios.get(
                    'personnelface/common/featurebyurl?face_img_url='+row.face_img_url)
                    .then(function(response){
                    if(response.data.code==0){                     
                        features=response.data.msg.feature;     
                        me.$router.push({ path: '/App/FootholdAnalysis', query:{ imageUrl:row.face_img_url, dateValue1: me.dateValue1, dateValue2:me.dateValue2,features:features}}); 
                        $('.FrequencyAnalysis').removeClass('analysisButtonActive');  
                        $('.FootholdAnalysis').addClass('analysisButtonActive');                        
                    }
                })
                .catch(function (error) {
						console.log(error);
                    });                                 
            }