1、vue2使用 vue-cli安装的项目 config目录下面都有 dev.env.js/test.env.js/prod.env.js文件,做相应的修改,添加API_ROOT
module.exports = merge(prodEnv, {
NODE_ENV: '"development"',
API_ROOT: '"http://www.eastgrain.cn"'
})
2、src下面添加api目录添加api.js文件
import axios from 'axios'
// 创建配置
const Axios = axios.create({
baseURL: process.env.API_ROOT,
timeout: 20000,
headers: {
'Content-Type': 'application/json'
}
})
// request 拦截器 请求开始显示loading等等
Axios.interceptors.request.use((config) => {
console.log(config, 'config axios配置')
// 显示loading...
return config
}, (error) => {
return Promise.reject(error)
})
// response 拦截器
Axios.interceptors.response.use((response) => {
console.log(response, 'axios response配置')
// 这里可以做处理,response.data.code 错误码不同显示不同错误信息
return response.data
}, (error) => {
return Promise.reject(error)
})
export default Axios
3、在文件中调用
import Axios from '@/api/api'
methods: {
// 访问接口
getFormData () {
Axios.post('customer/modifyUserInfo.json', {phone: 15001209233}).then((success) => { console.log(success)// 这里可以出发vuex中的mutations、actions来修改vuex state中的数据 }).then((err) => { console.log(err) })
},
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。