Vue框架中怎么调用模拟数据
导读:本文共962字符,通常情况下阅读需要3分钟。同时您也可以点击右侧朗读,来听本文内容。按键盘←(左) →(右) 方向键可以翻页。
摘要: 1、框架结构mock是模拟数据文件夹,文件夹中有index.js,里面包含所模拟的接口数据:如下所示constMock=require("mockjs");const{param2Obj}=require("./utils");constuser=require("./user");//调用方... ...
音频解说
目录
(为您整理了一些要点),点击可以直达。1、框架结构
mock是模拟数据文件夹,文件夹中有index.js,里面包含所模拟的接口数据:如下所示
constMock=require("mockjs");const{param2Obj}=require("./utils");constuser=require("./user");//调用方式constmocks=[...user];functionmockXHR(){//mockpatch//https://github.com/nuysoft/Mock/issues/300Mock.XHR.prototype.proxy_send=Mock.XHR.prototype.send;Mock.XHR.prototype.send=function(){if(this.custom.xhr){this.custom.xhr.withCredentials=this.withCredentials||false;if(this.responseType){this.custom.xhr.responseType=this.responseType;}}this.proxy_send(...arguments);};functionXHR2ExpressReqWrap(respond){returnfunction(options){letresult=null;if(respondinstanceofFunction){const{body,type,url}=options;//https://expressjs.com/en/4x/api.html#reqresult=respond({method:type,body:JSON.parse(body),query:param2Obj(url),});}else{result=respond;}returnMock.mock(result);};}for(constiofmocks){Mock.mock(newRegExp(i.url),i.type||"get",XHR2ExpressReqWrap(i.response));}}module.exports={mocks,mockXHR,};
2、在api中进行调用:如图
然后就可以成功请求数据
</div> <div class="zixun-tj-product adv-bottom"></div> </div> </div> <div class="prve-next-news">
本文:
Vue框架中怎么调用模拟数据的详细内容,希望对您有所帮助,信息来源于网络。