uniapp获取请求的参数

uniapp中获取请求的参数

在前端开发中,需要向后台发起数据请求,获取需要的数据。其实,前端在向后台发起请求时,除了要发起请求的url,还需要传入一些参数。那么,如何在uniapp中获取请求的参数呢?下面将为大家介绍uniapp中获取参数的方法。

1. 通过this.$route.query获取参数

在uniapp中,我们可以通过this.$route.query获取get请求的参数。比如,下面的请求url是http://localhost:8080/demo?name=张三&age=18&gender=男,我们需要获取其中的参数。

//定义一个获取参数的方法

getData(){

console.log(this.$route.query.name)//张三

console.log(this.$route.query.age)//18

console.log(this.$route.query.gender)//男

}

在上面的代码中,我们可以看到,通过this.$route.query即可获取url中的参数。

2. 通过this.$route.params获取参数

与get请求不同,post请求一般是将参数放在请求体中,而不是放在url中。因此,在uniapp中,我们需要通过this.$route.params获取post请求中的参数。比如,下面的请求url是http://localhost:8080/demo,请求体中有{name:张三,age:18,gender:男}这些参数。

//定义一个获取参数的方法

getData(){

console.log(this.$route.params.name)//张三

console.log(this.$route.params.age)//18

console.log(this.$route.params.gender)//男

}

在上面的代码中,我们可以看到,通过this.$route.params即可获取post请求中的参数。

3. 通过this.$https.get/post获取参数

在uniapp中,我们也可以通过this.$https.get/post方法直接获取参数。比如,下面的请求url是http://localhost:8080/demo,请求体中有{name:张三,age:18,gender:男}这些参数。

//定义一个获取参数的方法

getData(){

this.$https.post('http://localhost:8080/demo',{

name:'张三',

age:18,

gender:'男'

}).then(result=>{

console.log(result.data)

})

}

在上面的代码中,我们利用了this.$https.post方法发起了post请求,并向后台传入了一个参数对象。使用then方法可以获取到后台返回的数据,其中result.data即为后台返回的数据。

总结

通过本文的介绍,我们可以看到,在uniapp中获取请求的参数非常简单。我们可以通过this.$route.query获取get请求中的参数,通过this.$route.params获取post请求中的参数,也可以直接在get/post方法中传递参数对象。