//in Main.js//Introducing your Mock.js fileRequire ('./mock.js ')) //Encapsulating API Requests//Src/axios/api.jsImport Axios from' Axios 'Import Vue from' Vue 'axios.defaults.headers.post[' Content-type '] = ' application/x-www-form-urlencoded '//Request InterceptorAxios.interceptors.request.use (function(config) {returnconfig;},function(Error) {returnPromise.reject (Error);})//Response InterceptorsAxios.interceptors.response.use (function(response) {returnresponse;},function(Error) {returnPromise.reject (Error);})//encapsulating the Axios POST requestExportfunctionfetch (URL, params) {return NewPromise (Resolve, reject) ={axios.post (URL, params). Then (response={Resolve (response.data);}).Catch(Error) ={reject (error);})})} Exportdefault{jh_news (URL, params) {returnfetch (URL, params);}} SRC/mock.js//mock.js//introduction of MockjsConst MOCK = require (' Mockjs ');//get a mock. Random ObjectConst RANDOM =Mock.random;//mock a set of dataConst PRODUCENEWSDATA =function() {Let articles= []; for(Let i = 0; i < i++;) {Let Newarticleobject={title:Random.csentence (5, 30),//random.csentence (min, max)Thumbnail_pic_s:Random.dataImage (' 300x250 ', ' mock Pictures '),//random.dataimage (size, text) generates a random Base64 image encodingAuthor_name:Random.cname (),//random.cname () randomly generates a common Chinese nameDate:Random.date () + "+ random.time ()//random.date () indicates the format of the resulting date string, which defaults to Yyyy-mm-dd;random.time () returns a random time string}articles.push (newarticleobject)}return{Articles:articles}}//mock.mock (URL, post/get, returned data);Mock.mock ('/news/index ', ' post ', Producenewsdata);//Use the Component Import API from‘./.. /axios/api.js 'API. Jh_news ('/news/index ', ' type=top&key=123456 '). Then (res={console.log (res); This. Newslistshow =res.articles;});
Axios Interceptor +mockjs