mirror of
https://github.com/pure-admin/vue-pure-admin.git
synced 2025-06-06 00:18:51 +08:00
2 lines
3.7 KiB
JavaScript
2 lines
3.7 KiB
JavaScript
import{d as J,a as n,b as m,w as o,e as i,A as T,f as r,g as u,i as t,h as l,B as s,k as K,t as U,j as M,L as p}from"./index-DvR-FJVF.js";const O={class:"card-header"},P=u("p",{class:"font-medium"},"自定义防抖、截流、文本复制、长按指令",-1),Q={class:"mb-2"},W={class:"mb-2"},X={class:"mb-2"},Y={class:"mb-2"},Z={class:"text-sky-500"},te=J({name:"Directives",__name:"directives",setup(ee){const b=n(""),x=n(""),g=n(""),h=n(""),w=n(""),k=n("copy"),B=n("可复制的文本"),c=n(!1),_=n(""),y=n(0);function I(){p(b.value)}function F(){p(x.value)}function L({name:f,sex:e}){p(`${f}${e}${g.value}`)}function N(){p(h.value)}function S({name:f,sex:e}){p(`${f}${e}${w.value}`)}function j(){c.value=!0}function A(){c.value=!0}function E(){y.value+=1,c.value=!0,_.value=`持续回调${y.value}次`}function R(){c.value=!1,_.value="",y.value=0}return(f,e)=>{const q=i("el-link"),d=i("el-input"),C=i("el-divider"),V=i("el-button"),z=i("el-tag"),G=i("el-space"),H=i("el-card"),v=T("optimize"),D=T("copy"),$=T("longpress");return r(),m(H,{shadow:"never"},{header:o(()=>[u("div",O,[P,t(q,{class:"mt-2",href:"https://github.com/pure-admin/vue-pure-admin/blob/main/src/views/able/directives.vue",target:"_blank"},{default:o(()=>[l(" 代码位置 src/views/able/directives.vue ")]),_:1})])]),default:o(()=>[u("div",Q,[l(" 防抖指令(连续输入,只会执行第一次点击事件,立即执行) "),s(t(d,{modelValue:b.value,"onUpdate:modelValue":e[0]||(e[0]=a=>b.value=a),class:"!w-[200px]",clearable:"",onClear:I},null,8,["modelValue"]),[[v,{event:"input",fn:I,immediate:!0,timeout:1e3}]])]),u("div",W,[l(" 防抖指令(连续输入,只会执行最后一次事件,延后执行) "),s(t(d,{modelValue:x.value,"onUpdate:modelValue":e[1]||(e[1]=a=>x.value=a),class:"!w-[200px]",clearable:""},null,8,["modelValue"]),[[v,{event:"input",fn:F,timeout:400}]])]),u("div",null,[l(" 防抖指令(连续输入,只会执行最后一次事件,延后执行,传参用法) "),s(t(d,{modelValue:g.value,"onUpdate:modelValue":e[2]||(e[2]=a=>g.value=a),class:"!w-[200px]",clearable:""},null,8,["modelValue"]),[[v,{event:"input",fn:L,timeout:400,params:{name:"小明",sex:"男"}}]])]),t(C),u("div",X,[l(" 节流指令(连续输入,每一秒只会执行一次事件) "),s(t(d,{modelValue:h.value,"onUpdate:modelValue":e[3]||(e[3]=a=>h.value=a),class:"!w-[200px]",clearable:""},null,8,["modelValue"]),[[v,{event:"input",fn:N,timeout:1e3},"throttle"]])]),u("div",null,[l(" 节流指令(连续输入,每一秒只会执行一次事件,传参用法) "),s(t(d,{modelValue:w.value,"onUpdate:modelValue":e[4]||(e[4]=a=>w.value=a),class:"!w-[200px]",clearable:""},null,8,["modelValue"]),[[v,{event:"input",fn:S,params:{name:"小明",sex:"男"}},"throttle"]])]),t(C),u("div",Y,[l(" 文本复制指令(双击输入框内容即可复制) "),s(t(d,{modelValue:k.value,"onUpdate:modelValue":e[5]||(e[5]=a=>k.value=a),class:"!w-[200px]"},null,8,["modelValue"]),[[D,k.value]])]),u("div",null,[l(" 文本复制指令(自定义触发事件,单击复制) "),s((r(),K("span",Z,[l(U(B.value),1)])),[[D,B.value,"click"]])]),t(C),t(G,{wrap:""},{default:o(()=>[l(" 长按指令 "),s((r(),m(V,null,{default:o(()=>[l("长按(默认500ms)")]),_:1})),[[$,j]]),s((r(),m(V,null,{default:o(()=>[l(" 自定义长按时长(1000ms) ")]),_:1})),[[$,A,"1000"]]),s((r(),m(V,null,{default:o(()=>[l(" 2秒后每200ms持续回调 ")]),_:1})),[[$,E,"2000:200"]]),t(V,{onClick:R},{default:o(()=>[l(" 重置状态 ")]),_:1}),t(z,{type:c.value?"success":"info",class:"ml-2",size:"large"},{default:o(()=>[l(U(c.value?"当前为长按状态":"当前非长按状态"),1)]),_:1},8,["type"]),_.value?(r(),m(z,{key:0,type:"danger",class:"ml-2",size:"large"},{default:o(()=>[l(U(_.value),1)]),_:1})):M("",!0)]),_:1})]),_:1})}}});export{te as default};
|