传递数组参数是前端开发中非常常见的需求,vue中的get和post方法也是我们日常开发中最常使用的API请求方式之一。下面是具体步骤:
一、利用axios的方式发送请求(Vue-Axios)
- 安装axios和Vue-Axios
npm install axios vue-axios --save
- 在Vue中全局引入axios
import Vue from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'
Vue.use(VueAxios, axios)
- 在vue实例中使用Vue-Axios
在实例中,我们可以使用Vue-axios发送get(post)请求,从而实现我们需要发送数组参数的需求。示例代码如下:
this.axios.get('/api/test', {
params: {
arr: [1, 2, 3]
}
})
.then(response => {
console.log(response.data)
})
.catch(error => {
console.log(error)
})
二、利用Vue-resource发送GET/POST请求
Vue-resource也是Vue官方提供的一个HTTP请求库,简单易用,支持Promise和浏览器缓存。
- 安装Vue-resource
npm install vue-resource --save
- 在Vue中全局引入Vue-resource
import Vue from 'vue'
import VueResource from 'vue-resource'
Vue.use(VueResource)
- 在Vue实例中使用Vue-resource
this.$http.get('/api/test', {
params: {
arr: [1, 2, 3]
}
})
.then(response => {
console.log(response.body)
}, error => {
console.log(error)
})
以上两种方式,分别通过Vue-Axios和Vue-resource实现了在Vue中发送get和post请求,并传递数组参数的需求。
需要注意的是,get方式中需要将数组参数封装在params对象中,而post方式中则需要将数组参数放在请求的data对象中,从而实现传递数组参数的需求。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:vue中的get方法\post方法如何实现传递数组参数 - Python技术站