Vue axios
时间: 2023-07-04 11:09:20 浏览: 189
Vue Axios是一个基于Promise的HTTP客户端,可以用于浏览器和Node.js环境中。它是Vue.js官方推荐的插件之一,可以很方便地在Vue项目中使用。
使用Vue Axios需要先导入axios库,并且在Vue实例中进行配置。一般情况下,我们会在main.js文件中进行全局配置,以便在整个项目中都能使用。
以下是一个简单的Vue Axios配置示例:
```js
import Vue from 'vue'
import axios from 'axios'
// 全局配置
axios.defaults.baseURL = 'http://localhost:3000/api'
axios.defaults.timeout = 5000
// 挂载到Vue原型上
Vue.prototype.$http = axios
```
在上面的代码中,我们将axios库的基础URL设置为http://localhost:3000/api,并将超时时间设置为5秒。然后,我们通过Vue.prototype将axios实例挂载到Vue原型上,这样在组件中就可以通过this.$http来使用axios了。
例如,在组件中使用axios发送GET请求的示例代码如下:
```js
export default {
mounted() {
this.$http.get('/users')
.then(response => {
console.log(response.data)
})
.catch(error => {
console.log(error)
})
}
}
```
在上面的代码中,我们通过this.$http访问了http://localhost:3000/api/users接口,并在控制台打印了返回数据。如果请求失败,则会在控制台打印错误信息。
阅读全文