mirror of
https://github.com/XiaoDaiGua-Ray/ray-template.git
synced 2025-04-06 03:57:49 +08:00
2 lines
7.7 KiB
JavaScript
2 lines
7.7 KiB
JavaScript
var P=Object.defineProperty;var N=(e,t,r)=>t in e?P(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r;var B=(e,t,r)=>(N(e,typeof t!="symbol"?t+"":t,r),r);import{u as F}from"./vue-hooks-plus@1.7.6_vue@3.3.4-1baf6b87.js";import"./lodash@4.17.21-2cee12c8.js";import{a as j}from"./axios@1.2.0-413e2d92.js";import{g as y,h as L,A as H}from"./index-925f82f6.js";import{k as O,b as u,p as n}from"./@vue_runtime-core@3.3.4-073fad6e.js";import{h as U,v as K}from"./@vue_reactivity@3.3.4-2b3a1c4e.js";import{f as d,U as m,P as T,p as A,B as S}from"./naive-ui@2.34.4_vue@3.3.4-eb250861.js";import"./@babel_runtime@7.22.6-960cbc2f.js";import"./form-data@4.0.0-19dc8c5e.js";import"./vue-router@4.2.4_vue@3.3.4-4991130b.js";import"./lodash-es@4.17.21-b7de4195.js";import"./vue-i18n@9.2.2_vue@3.3.4-a7a92bd0.js";import"./@intlify_shared@9.2.2-e4047ebf.js";import"./@intlify_core-base@9.2.2-a0a8715c.js";import"./@intlify_message-compiler@9.2.2-8a818441.js";import"./@intlify_devtools-if@9.2.2-c61c979f.js";import"./dayjs@1.11.7-adc18375.js";import"./pinia@2.1.4_typescript@5.0.2_vue@3.3.4-ab93b4ec.js";import"./vue-demi@0.14.5_vue@3.3.4-71ba0ef2.js";import"./screenfull@6.0.2-b3e6dc1f.js";import"./@vue_runtime-dom@3.3.4-d86573ec.js";import"./@vue_shared@3.3.4-896c5ecf.js";import"./@vueuse_core@9.1.0_vue@3.3.4-f4b6b7e2.js";import"./@vueuse_shared@9.1.0_vue@3.3.4-e5bccb39.js";import"./pinia-plugin-persistedstate@3.1.0_pinia@2.1.4-4f3b1591.js";import"./clipboard@2.0.11-6193b289.js";import"./date-fns@2.30.0-0bf1b710.js";import"./vueuc@0.4.51_vue@3.3.4-6588b5bd.js";import"./evtd@0.2.4-b614532e.js";import"./seemly@0.3.6-dc6f1e91.js";import"./@css-render_vue3-ssr@0.15.12_vue@3.3.4-24369cc5.js";import"./vooks@0.2.12_vue@3.3.4-59877c34.js";import"./vdirs@0.1.8_vue@3.3.4-4519c5fd.js";import"./@juggle_resize-observer@3.4.0-41516555.js";import"./css-render@0.15.12-57b1a53f.js";import"./@emotion_hash@0.8.0-8a8e73f6.js";import"./treemate@0.3.11-25c27bff.js";import"./date-fns-tz@1.3.8_date-fns@2.30.0-7cff6900.js";import"./async-validator@4.2.5-dee29e8b.js";import"./@css-render_plugin-bem@0.15.12_css-render@0.15.12-9dde7ffe.js";const W={baseURL:"",withCredentials:!1,timeout:5*1e3,headers:{"Content-Type":"application/json"}};class M{constructor(){B(this,"pendingRequest");this.pendingRequest=new Map}generateRequestKey(t){const{method:r,url:a}=t;return[a||"",r||"",JSON.stringify(t.params),JSON.stringify(t.data)].join("&")}addPendingRequest(t){var a;const r=this.generateRequestKey(t);if(this.pendingRequest.has(r))t.signal=(a=this.pendingRequest.get(r))==null?void 0:a.signal;else{const l=new AbortController;t.signal=l.signal,this.pendingRequest.set(r,l)}}removePendingRequest(t){const r=this.generateRequestKey(t);this.pendingRequest.has(r)&&(this.pendingRequest.get(r).abort(),this.pendingRequest.delete(r))}}const g={requestInstance:null,responseInstance:null},I={implementRequestInterceptorArray:[],implementResponseInterceptorArray:[]},D={implementRequestInterceptorErrorArray:[],implementResponseInterceptorErrorArray:[]},E=new M,q=()=>{const e=(o,s)=>{s==="requestInstance"?g.requestInstance=o:g.responseInstance=o},t=o=>g[o],r=(o,s,i)=>{i==="ok"?I[o]=s:D[o]=s},a=(o,s)=>s==="ok"?I[o]:D[o],l=(o,...s)=>{Array.isArray(o)&&(o==null||o.forEach(i=>{typeof i=="function"&&i(...s)}))};return{createAxiosInstance:e,setImplement:r,getImplement:a,getAxiosInstance:t,beforeFetch:(o,s,i)=>{const c=i==="ok"?I[s]:D[s],p=t(o),{MODE:R}=y();p&&l(c,p,R)},fetchError:(o,s,i)=>{const c=D[i],{MODE:p}=y();l(c,s,p)}}},{setImplement:b}=q(),_=(e,t)=>{E.removePendingRequest(e.config)},$=(e,t)=>{},J=()=>{b("implementResponseInterceptorArray",[_],"ok")},X=()=>{b("implementResponseInterceptorErrorArray",[$],"error")},Y=(e,t)=>{if(e){const r=e.headers;t.forEach(a=>{r[a.key]=a.value})}},{setImplement:V}=q(),z=(e,t)=>{const r=L(H.token);return e.url,{key:"X-TOKEN",value:r}},G=(e,t)=>{Y(e,[z(e),{key:"Demo-Header-Key",value:"Demo Header Value"}])},Q=(e,t)=>{E.removePendingRequest(e),E.addPendingRequest(e)},Z=(e,t)=>{},ee=()=>{V("implementRequestInterceptorArray",[G,Q],"ok")},te=()=>{V("implementRequestInterceptorErrorArray",[Z],"error")},h=j.create(W),{createAxiosInstance:k,beforeFetch:x,fetchError:w}=q();h.interceptors.request.use(e=>(k(e,"requestInstance"),ee(),x("requestInstance","implementRequestInterceptorArray","ok"),e),e=>(te(),w("requestError",e,"implementRequestInterceptorErrorArray"),Promise.reject(e)));h.interceptors.response.use(e=>{k(e,"responseInstance"),J(),x("responseInstance","implementResponseInterceptorArray","ok");const{data:t}=e;return Promise.resolve(t)},e=>(X(),w("responseError",e,"implementResponseInterceptorErrorArray"),E.removePendingRequest(e.config||{}),Promise.reject(e)));function ue(e,t){return F(()=>h(e),Object.assign({},t))}const re=e=>h({url:`https://www.tianqiapi.com/api?version=v9&appid=23035354&appsecret=8YvlPNrz&city=${e}`,method:"get"}),v=()=>h({url:"https://jsonplaceholder.typicode.com/todos/1",method:"get"}),_e=O({name:"RAxios",setup(){const e=U({weatherData:[],inputCityValue:null,throttleDemoInputValue:null,debounceDemoInputValue:null,weatherDemoInputValue:null}),{data:t,loading:r,run:a}=F(v,{throttleWait:1e3}),{data:l,loading:C,run:f}=F(v,{debounceWait:1e3}),{data:o,loading:s,run:i}=F(re,{throttleWait:1e3}),{data:c,loading:p,run:R}=ue({url:"https://jsonplaceholder.typicode.com/todos/1",method:"get"},{manual:!0});return{...K(e),throttleDemoValue:t,throttleDemoLoading:r,throttleDemoRun:a,debounceDemoValue:l,debounceDemoLoading:C,debounceDemoRun:f,weatherDemoValue:o,weatherDemoLoading:s,weatherDemoRun:i,demoData:c,demoLoading:p,demoRun:R}},render(){return u(S,null,{default:()=>[u(d,{vertical:!0},{default:()=>[u("h1",null,[n("请求")]),u(m,null,{default:()=>[u("h2",null,[n("useRequest")]),u("p",null,[n("支持配置化请求数据")]),u("h2",null,[n("useHookPlusRequest")]),u("p",null,[n("支持包裹一个拥有 promise 状态的异步函数,可以用来包裹一个 axios 请求返回值方法")])]}),u("h1",null,[n("使用 useRequest 获取")]),u(m,{title:"请求函数"},{default:()=>[u("h3",null,[n("1.基于 axios 封装,能够自动取消连续请求,避免重复渲染造成问题")]),u("h3",null,[n("2.打开控制台 => 网络 => 使用低速3g网络 => 查看控制台被取消的请求")]),u("h3",null,[n("3.详情请查看文档")])]}),u(m,{title:"useRequest示例(手动触发)"},{default:()=>[u(d,{vertical:!0},{default:()=>{var e;return[u(T,{onClick:this.demoRun.bind(this)},{default:()=>[n("获取数据")]}),u("h3",null,[n("结果: "),this.demoLoading?"获取中...":(e=this.demoData)==null?void 0:e.title])]}})]}),u("h1",null,[n("使用 useHookPlusRequest 获取")]),u(m,{title:"节流"},{default:()=>[u(d,{vertical:!0},{default:()=>[u(A,{value:this.throttleDemoInputValue,"onUpdate:value":e=>this.throttleDemoInputValue=e,onUpdateValue:()=>{this.throttleDemoRun()}},null),u("h3",null,[n("不论触发多少次,一秒钟之内仅会触发一次")]),u("h3",null,[n("当前状态: "),this.throttleDemoLoading?"获取中...":"获取成功!!!"])]})]}),u(m,{title:"防抖"},{default:()=>[u(d,{vertical:!0},{default:()=>[u(A,{value:this.debounceDemoInputValue,"onUpdate:value":e=>this.debounceDemoInputValue=e,onUpdateValue:()=>{this.debounceDemoRun()}},null),u("h3",null,[n("一秒后才会执行,如果中途重新请求,则会重新计时")]),u("h3",null,[n("当前状态: "),this.debounceDemoLoading?"获取中...":"获取成功!!!"])]})]}),u(m,{title:"获取气候"},{default:()=>[u(d,{vertical:!0},{default:()=>[u(A,{value:this.weatherDemoInputValue,"onUpdate:value":e=>this.weatherDemoInputValue=e,onUpdateValue:e=>{this.weatherDemoRun(e)}},null),u("h3",null,[n("该示例演示了如何根据动态值获取数据")]),u("h3",null,[n("当前状态: "),this.weatherDemoLoading?"获取中...":"获取成功!!!"])]})]})]})]})}});export{_e as default};
|