vue3集成axios,添加拦截器
文档>>npm install axios --save在main.ts中引入import { createApp } from 'vue'import axios from 'axios' // 1、引入import router from './router'import store from './store'import App from './App.vue'axios.de
·
npm install axios --save
在main.ts中引入
import { createApp } from 'vue'
import axios from 'axios' // 1、引入
import router from './router'
import store from './store'
import App from './App.vue'
axios.defaults.baseURL = 'http://localhost:7001/api/' // 2、配置基础API
axios.interceptors.request.use(config => { // 3、添加拦截器
store.commit('setLoading', true)
store.commit('setError', { status: false, message: '' })
return config
})
axios.interceptors.response.use(config => { // 4、添加拦截器
setTimeout(() => {
store.commit('setLoading', false)
}, 1000)
return config
}, e => {
const { error } = e.response.data
store.commit('setError', { status: true, message: error })
store.commit('setLoading', false)
return Promise.reject(e.response.data)
})
const app = createApp(App)
app.use(router)
app.use(store)
app.mount('#app')
官方配置Interceptors拦截器示例
// Add a request interceptor
axios.interceptors.request.use(function (config) {
// Do something before request is sent
return config;
}, function (error) {
// Do something with request error
return Promise.reject(error);
});
// Add a response interceptor
axios.interceptors.response.use(function (response) {
// Any status code that lie within the range of 2xx cause this function to trigger
// Do something with response data
return response;
}, function (error) {
// Any status codes that falls outside the range of 2xx cause this function to trigger
// Do something with response error
return Promise.reject(error);
});
更多推荐
已为社区贡献19条内容
所有评论(0)