vue2axios配置
时间: 2023-09-07 22:11:49 浏览: 117
axios和vue跨域
在Vue2中使用Axios需要进行一些配置。下面是一个简单的Vue2和Axios的配置示例:
1. 首先,你需要在项目中安装Axios。可以使用npm或者yarn来安装Axios,运行以下命令:
```
npm install axios
```
或者
```
yarn add axios
```
2. 在你的Vue组件中,你需要引入Axios,并创建一个全局的Axios实例。可以在`main.js`中进行配置:
```javascript
import Vue from 'vue'
import axios from 'axios'
// 设置基本的URL
axios.defaults.baseURL = 'http://api.example.com'
// 添加请求拦截器
axios.interceptors.request.use(function (config) {
// 在发送请求之前做些什么
return config;
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error);
});
// 添加响应拦截器
axios.interceptors.response.use(function (response) {
// 对响应数据做些什么
return response;
}, function (error) {
// 对响应错误做些什么
return Promise.reject(error);
});
// 将axios实例挂载到Vue原型上
Vue.prototype.$http = axios;
```
3. 现在你可以在任何Vue组件中使用`this.$http`来发送请求了。例如,在一个Vue组件的方法中发送一个GET请求:
```javascript
this.$http.get('/users')
.then(response => {
console.log(response.data);
})
.catch(error => {
console.error(error);
});
```
这就是Vue2中配置Axios的基本步骤。你可以根据自己的需求进行进一步的配置和使用。
阅读全文