SoFunction
Updated on 2025-04-03

Detailed explanation of the example code of Vue integrated axios

In vue development, it is inevitable to integrate axios and simply record the integrated files to facilitate future use and search.

Integrate files

import axios from 'axios';

// Adapt to vue-resource
const instance = ();
(config=> {
//(config);
return config;
});
(response=> {
return ;
}, err=> {
if () {
('/v1/error', );
return ();
}
return ({ code: 1024, message:  });
});


functionplugin(Vue){
if () {
return;
}
 = instance;
}

if (typeof window !== 'undefined' && ) {
(plugin);
}

export default plugin;

Use vue plugin

import Vue from 'vue';
import App from './';
import store from './store';
import { sync } from 'vuex-router-sync';
import router from './router';
import * as filters from './filters';
import yxui from 'yxui/dist/';
import axios from './axios';


(yxui);
(axios);

// sync the router with the vuex store.
// this registers ``
sync(store, router);

// register global utility filters.
(filters).forEach(key=> {
(key, filters[key]);
});

// create the app instance.
// here we inject the router and store to all child components,
// making them available everywhere as `this.$router` and `this.$store`.

const app = new Vue({
router,
store,
...App
});

// expose the app, the router and the store.
// note we not mounting the app here, since bootstrapping will be
// different depending on whether we are in browser or on the server.
export { app, router, store };

Use in vuex action:

actions: {
// adList
[TypesAds.AD_GET_LIST](ctx, params){
return ('/v1/api/ads/list', {params}).then(data=> {
(TypesAds.AD_GET_LIST, data);
return data;
}).catch(err=> {
//Unified error handlingVue.$();
});
}
}

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.