123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514 |
- import{_ as u,l as r,w as e,j as t,k as i,f as p,b as n,e as a,d as b,r as f,T as B,aO as G,a as A,q as y}from"./index.3fe853a6.js";const Z={};function N(o,s){const c=t("a-spin"),l=t("demo-box");return i(),r(l,{jsfiddle:{us:"A simple loading status.",cn:"\u4E00\u4E2A\u7B80\u5355\u7684 loading \u72B6\u6001\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>\u4E00\u4E2A\u7B80\u5355\u7684 loading \u72B6\u6001\u3002</p>
- <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>A simple loading status.</p>
- `,order:0,title:{"zh-CN":"\u57FA\u672C\u7528\u6CD5","en-US":"Basic usage"},relativePath:"components/spin/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwaW4gLz4KPC90ZW1wbGF0ZT4KCgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwaW4gLz4KPC90ZW1wbGF0ZT4="}},{default:e(()=>[p(c)]),htmlCode:e(()=>s[0]||(s[0]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),jsVersionHtml:e(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),_:1})}const S=u(Z,[["render",N]]),X={};function P(o,s){const c=t("a-spin"),l=t("a-space"),k=t("demo-box");return i(),r(k,{jsfiddle:{us:"A small `Spin` use in loading text, default `Spin` use in loading card-level block, and large `Spin` use in loading **page**.",cn:"\u5C0F\u7684\u7528\u4E8E\u6587\u672C\u52A0\u8F7D\uFF0C\u9ED8\u8BA4\u7528\u4E8E\u5361\u7247\u5BB9\u5668\u7EA7\u52A0\u8F7D\uFF0C\u5927\u7684\u7528\u4E8E**\u9875\u9762\u7EA7**\u52A0\u8F7D\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>\u5C0F\u7684\u7528\u4E8E\u6587\u672C\u52A0\u8F7D\uFF0C\u9ED8\u8BA4\u7528\u4E8E\u5361\u7247\u5BB9\u5668\u7EA7\u52A0\u8F7D\uFF0C\u5927\u7684\u7528\u4E8E<strong>\u9875\u9762\u7EA7</strong>\u52A0\u8F7D\u3002</p>
- <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>A small <code>Spin</code> use in loading text, default <code>Spin</code> use in loading card-level block, and large <code>Spin</code> use in loading <strong>page</strong>.</p>
- `,order:1,title:{"zh-CN":"\u5404\u79CD\u5927\u5C0F","en-US":"Size"},relativePath:"components/spin/demo/size.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlPgogICAgPGEtc3BpbiBzaXplPSJzbWFsbCIgLz4KICAgIDxhLXNwaW4gLz4KICAgIDxhLXNwaW4gc2l6ZT0ibGFyZ2UiIC8+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPgoKCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlPgogICAgPGEtc3BpbiBzaXplPSJzbWFsbCIgLz4KICAgIDxhLXNwaW4gLz4KICAgIDxhLXNwaW4gc2l6ZT0ibGFyZ2UiIC8+CiAgPC9hLXNwYWNlPgo8L3RlbXBsYXRlPg=="}},{default:e(()=>[p(l,null,{default:e(()=>[p(c,{size:"small"}),p(c),p(c,{size:"large"})]),_:1})]),htmlCode:e(()=>s[0]||(s[0]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-space")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("small"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("large"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-space")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),jsVersionHtml:e(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-space")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("small"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("large"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-space")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),_:1})}const _=u(X,[["render",P]]);const x={},z={class:"example"};function Y(o,s){const c=t("a-spin"),l=t("demo-box");return i(),r(l,{jsfiddle:{us:"Spin in a container.",cn:"\u653E\u5165\u4E00\u4E2A\u5BB9\u5668\u4E2D\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>\u653E\u5165\u4E00\u4E2A\u5BB9\u5668\u4E2D\u3002</p>
- <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>Spin in a container.</p>
- `,order:2,title:{"zh-CN":"\u5BB9\u5668","en-US":"Inside a container"},relativePath:"components/spin/demo/inside.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXYgY2xhc3M9ImV4YW1wbGUiPgogICAgPGEtc3BpbiAvPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgoKPHN0eWxlIHNjb3BlZD4KLmV4YW1wbGUgewogIHRleHQtYWxpZ246IGNlbnRlcjsKICBiYWNrZ3JvdW5kOiByZ2JhKDAsIDAsIDAsIDAuMDUpOwogIGJvcmRlci1yYWRpdXM6IDRweDsKICBtYXJnaW4tYm90dG9tOiAyMHB4OwogIHBhZGRpbmc6IDMwcHggNTBweDsKICBtYXJnaW46IDIwcHggMDsKfQo8L3N0eWxlPgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXYgY2xhc3M9ImV4YW1wbGUiPgogICAgPGEtc3BpbiAvPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgoKPHN0eWxlIHNjb3BlZD4KLmV4YW1wbGUgewogIHRleHQtYWxpZ246IGNlbnRlcjsKICBiYWNrZ3JvdW5kOiByZ2JhKDAsIDAsIDAsIDAuMDUpOwogIGJvcmRlci1yYWRpdXM6IDRweDsKICBtYXJnaW4tYm90dG9tOiAyMHB4OwogIHBhZGRpbmc6IDMwcHggNTBweDsKICBtYXJnaW46IDIwcHggMDsKfQo8L3N0eWxlPg=="}},{default:e(()=>[n("div",z,[p(c)])]),htmlCode:e(()=>s[0]||(s[0]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
- `),n("span",{class:"token selector"},".example"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token property"},"text-align"),n("span",{class:"token punctuation"},":"),a(" center"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(),n("span",{class:"token function"},"rgba"),n("span",{class:"token punctuation"},"("),a("0"),n("span",{class:"token punctuation"},","),a(" 0"),n("span",{class:"token punctuation"},","),a(" 0"),n("span",{class:"token punctuation"},","),a(" 0.05"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token property"},"border-radius"),n("span",{class:"token punctuation"},":"),a(" 4px"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 20px"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),a(" 30px 50px"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),a(" 20px 0"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),jsVersionHtml:e(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("example"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
- `),n("span",{class:"token selector"},".example"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token property"},"text-align"),n("span",{class:"token punctuation"},":"),a(" center"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(),n("span",{class:"token function"},"rgba"),n("span",{class:"token punctuation"},"("),a("0"),n("span",{class:"token punctuation"},","),a(" 0"),n("span",{class:"token punctuation"},","),a(" 0"),n("span",{class:"token punctuation"},","),a(" 0.05"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token property"},"border-radius"),n("span",{class:"token punctuation"},":"),a(" 4px"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 20px"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),a(" 30px 50px"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),a(" 20px 0"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),_:1})}const R=u(x,[["render",Y],["__scopeId","data-v-6bf1d01a"]]),H=b({setup(){const o=f(!1);return{spinning:o,changeSpinning:()=>{o.value=!o.value}}}});const D={class:"spin-state"};function F(o,s,c,l,k,h){const d=t("a-alert"),g=t("a-spin"),m=t("a-switch"),I=t("demo-box");return i(),r(I,{jsfiddle:{us:"Embedding content into `Spin` will alter it into loading state.",cn:"\u53EF\u4EE5\u76F4\u63A5\u628A\u5185\u5BB9\u5185\u5D4C\u5230 `Spin` \u4E2D\uFF0C\u5C06\u73B0\u6709\u5BB9\u5668\u53D8\u4E3A\u52A0\u8F7D\u72B6\u6001\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>\u53EF\u4EE5\u76F4\u63A5\u628A\u5185\u5BB9\u5185\u5D4C\u5230 <code>Spin</code> \u4E2D\uFF0C\u5C06\u73B0\u6709\u5BB9\u5668\u53D8\u4E3A\u52A0\u8F7D\u72B6\u6001\u3002</p>
- <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>Embedding content into <code>Spin</code> will alter it into loading state.</p>
- `,order:3,title:{"zh-CN":"\u5361\u7247\u52A0\u8F7D\u4E2D","en-US":"Embedded mode"},relativePath:"components/spin/demo/nested.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwaW4gOnNwaW5uaW5nPSJzcGlubmluZyI+CiAgICA8YS1hbGVydAogICAgICBtZXNzYWdlPSJBbGVydCBtZXNzYWdlIHRpdGxlIgogICAgICBkZXNjcmlwdGlvbj0iRnVydGhlciBkZXRhaWxzIGFib3V0IHRoZSBjb250ZXh0IG9mIHRoaXMgYWxlcnQuIgogICAgPjwvYS1hbGVydD4KICA8L2Etc3Bpbj4KICA8ZGl2IGNsYXNzPSJzcGluLXN0YXRlIj4KICAgIExvYWRpbmcgc3RhdGXvvJoKICAgIDxhLXN3aXRjaCB2LW1vZGVsOmNoZWNrZWQ9InNwaW5uaW5nIiAvPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgc3Bpbm5pbmcgPSByZWY8Ym9vbGVhbj4oZmFsc2UpOwoKICAgIGNvbnN0IGNoYW5nZVNwaW5uaW5nID0gKCkgPT4gewogICAgICBzcGlubmluZy52YWx1ZSA9ICFzcGlubmluZy52YWx1ZTsKICAgIH07CgogICAgcmV0dXJuIHsKICAgICAgc3Bpbm5pbmcsCiAgICAgIGNoYW5nZVNwaW5uaW5nLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBzY29wZWQ+Ci5zcGluLXN0YXRlIHsKICBtYXJnaW4tdG9wOiAxNnB4Owp9Cjwvc3R5bGU+Cg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwaW4gOnNwaW5uaW5nPSJzcGlubmluZyI+CiAgICA8YS1hbGVydAogICAgICBtZXNzYWdlPSJBbGVydCBtZXNzYWdlIHRpdGxlIgogICAgICBkZXNjcmlwdGlvbj0iRnVydGhlciBkZXRhaWxzIGFib3V0IHRoZSBjb250ZXh0IG9mIHRoaXMgYWxlcnQuIgogICAgPjwvYS1hbGVydD4KICA8L2Etc3Bpbj4KICA8ZGl2IGNsYXNzPSJzcGluLXN0YXRlIj4KICAgIExvYWRpbmcgc3RhdGXvvJoKICAgIDxhLXN3aXRjaCB2LW1vZGVsOmNoZWNrZWQ9InNwaW5uaW5nIiAvPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBzcGlubmluZyA9IHJlZihmYWxzZSk7CiAgICBjb25zdCBjaGFuZ2VTcGlubmluZyA9ICgpID0+IHsKICAgICAgc3Bpbm5pbmcudmFsdWUgPSAhc3Bpbm5pbmcudmFsdWU7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgc3Bpbm5pbmcsCiAgICAgIGNoYW5nZVNwaW5uaW5nLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBzY29wZWQ+Ci5zcGluLXN0YXRlIHsKICBtYXJnaW4tdG9wOiAxNnB4Owp9Cjwvc3R5bGU+"}},{default:e(()=>[p(g,{spinning:o.spinning},{default:e(()=>[p(d,{message:"Alert message title",description:"Further details about the context of this alert."})]),_:1},8,["spinning"]),n("div",D,[s[1]||(s[1]=a(" Loading state\uFF1A ")),p(m,{checked:o.spinning,"onUpdate:checked":s[0]||(s[0]=C=>o.spinning=C)},null,8,["checked"])])]),htmlCode:e(()=>s[2]||(s[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},":spinning"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spinning"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-alert")]),a(`
- `),n("span",{class:"token attr-name"},"message"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Alert message title"),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token attr-name"},"description"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Further details about the context of this alert."),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-alert")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-spin")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spin-state"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- Loading state\uFF1A
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-switch")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spinning"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
- `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token keyword"},"const"),a(" spinning "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"changeSpinning"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
- spinning`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"!"),a("spinning"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
- spinning`),n("span",{class:"token punctuation"},","),a(`
- changeSpinning`),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
- `),n("span",{class:"token selector"},".spin-state"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),jsVersionHtml:e(()=>s[3]||(s[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},":spinning"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spinning"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-alert")]),a(`
- `),n("span",{class:"token attr-name"},"message"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Alert message title"),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token attr-name"},"description"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Further details about the context of this alert."),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-alert")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-spin")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spin-state"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- Loading state\uFF1A
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-switch")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spinning"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
- `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token keyword"},"const"),a(" spinning "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"changeSpinning"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
- spinning`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"!"),a("spinning"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
- spinning`),n("span",{class:"token punctuation"},","),a(`
- changeSpinning`),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
- `),n("span",{class:"token selector"},".spin-state"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),_:1})}const V=u(H,[["render",F],["__scopeId","data-v-704dd629"]]),L={};function K(o,s){const c=t("a-alert"),l=t("a-spin"),k=t("demo-box");return i(),r(k,{jsfiddle:{us:"Customized description content.",cn:"\u81EA\u5B9A\u4E49\u63CF\u8FF0\u6587\u6848\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>\u81EA\u5B9A\u4E49\u63CF\u8FF0\u6587\u6848\u3002</p>
- <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>Customized description content.</p>
- `,order:4,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u63CF\u8FF0\u6587\u6848","en-US":"Customized description"},relativePath:"components/spin/demo/tip.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwaW4gdGlwPSJMb2FkaW5nLi4uIj4KICAgIDxhLWFsZXJ0CiAgICAgIG1lc3NhZ2U9IkFsZXJ0IG1lc3NhZ2UgdGl0bGUiCiAgICAgIGRlc2NyaXB0aW9uPSJGdXJ0aGVyIGRldGFpbHMgYWJvdXQgdGhlIGNvbnRleHQgb2YgdGhpcyBhbGVydC4iCiAgICA+PC9hLWFsZXJ0PgogIDwvYS1zcGluPgo8L3RlbXBsYXRlPgoKCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwaW4gdGlwPSJMb2FkaW5nLi4uIj4KICAgIDxhLWFsZXJ0CiAgICAgIG1lc3NhZ2U9IkFsZXJ0IG1lc3NhZ2UgdGl0bGUiCiAgICAgIGRlc2NyaXB0aW9uPSJGdXJ0aGVyIGRldGFpbHMgYWJvdXQgdGhlIGNvbnRleHQgb2YgdGhpcyBhbGVydC4iCiAgICA+PC9hLWFsZXJ0PgogIDwvYS1zcGluPgo8L3RlbXBsYXRlPg=="}},{default:e(()=>[p(l,{tip:"Loading..."},{default:e(()=>[p(c,{message:"Alert message title",description:"Further details about the context of this alert."})]),_:1})]),htmlCode:e(()=>s[0]||(s[0]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},"tip"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Loading..."),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-alert")]),a(`
- `),n("span",{class:"token attr-name"},"message"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Alert message title"),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token attr-name"},"description"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Further details about the context of this alert."),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-alert")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-spin")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),jsVersionHtml:e(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},"tip"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Loading..."),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-alert")]),a(`
- `),n("span",{class:"token attr-name"},"message"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Alert message title"),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token attr-name"},"description"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Further details about the context of this alert."),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-alert")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-spin")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),_:1})}const j=u(L,[["render",K]]),U=b({setup(){const o=f(!1);return{spinning:o,delayTime:500,changeSpinning:()=>{o.value=!o.value}}}});const J={class:"spin-state"};function T(o,s,c,l,k,h){const d=t("a-alert"),g=t("a-spin"),m=t("a-switch"),I=t("demo-box");return i(),r(I,{jsfiddle:{us:"Specifies a delay for loading state. If `spinning` ends during delay, loading status won't appear.",cn:"\u5EF6\u8FDF\u663E\u793A loading \u6548\u679C\u3002\u5F53 spinning \u72B6\u6001\u5728 `delay` \u65F6\u95F4\u5185\u7ED3\u675F\uFF0C\u5219\u4E0D\u663E\u793A loading \u72B6\u6001\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>\u5EF6\u8FDF\u663E\u793A loading \u6548\u679C\u3002\u5F53 spinning \u72B6\u6001\u5728 <code>delay</code> \u65F6\u95F4\u5185\u7ED3\u675F\uFF0C\u5219\u4E0D\u663E\u793A loading \u72B6\u6001\u3002</p>
- <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>Specifies a delay for loading state. If <code>spinning</code> ends during delay, loading status won't appear.</p>
- `,order:5,title:{"zh-CN":"\u5EF6\u8FDF","en-US":"delay"},relativePath:"components/spin/demo/delay.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwaW4gOnNwaW5uaW5nPSJzcGlubmluZyIgOmRlbGF5PSJkZWxheVRpbWUiPgogICAgPGEtYWxlcnQKICAgICAgbWVzc2FnZT0iQWxlcnQgbWVzc2FnZSB0aXRsZSIKICAgICAgZGVzY3JpcHRpb249IkZ1cnRoZXIgZGV0YWlscyBhYm91dCB0aGUgY29udGV4dCBvZiB0aGlzIGFsZXJ0LiIKICAgID48L2EtYWxlcnQ+CiAgPC9hLXNwaW4+CiAgPGRpdiBjbGFzcz0ic3Bpbi1zdGF0ZSI+CiAgICBMb2FkaW5nIHN0YXRl77yaCiAgICA8YS1zd2l0Y2ggdi1tb2RlbDpjaGVja2VkPSJzcGlubmluZyIgLz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHNwaW5uaW5nID0gcmVmPGJvb2xlYW4+KGZhbHNlKTsKICAgIGNvbnN0IGRlbGF5VGltZSA9IDUwMDsKCiAgICBjb25zdCBjaGFuZ2VTcGlubmluZyA9ICgpID0+IHsKICAgICAgc3Bpbm5pbmcudmFsdWUgPSAhc3Bpbm5pbmcudmFsdWU7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgc3Bpbm5pbmcsCiAgICAgIGRlbGF5VGltZSwKICAgICAgY2hhbmdlU3Bpbm5pbmcsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlIHNjb3BlZD4KLnNwaW4tc3RhdGUgewogIG1hcmdpbi10b3A6IDE2cHg7Cn0KPC9zdHlsZT4K",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwaW4gOnNwaW5uaW5nPSJzcGlubmluZyIgOmRlbGF5PSJkZWxheVRpbWUiPgogICAgPGEtYWxlcnQKICAgICAgbWVzc2FnZT0iQWxlcnQgbWVzc2FnZSB0aXRsZSIKICAgICAgZGVzY3JpcHRpb249IkZ1cnRoZXIgZGV0YWlscyBhYm91dCB0aGUgY29udGV4dCBvZiB0aGlzIGFsZXJ0LiIKICAgID48L2EtYWxlcnQ+CiAgPC9hLXNwaW4+CiAgPGRpdiBjbGFzcz0ic3Bpbi1zdGF0ZSI+CiAgICBMb2FkaW5nIHN0YXRl77yaCiAgICA8YS1zd2l0Y2ggdi1tb2RlbDpjaGVja2VkPSJzcGlubmluZyIgLz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgc3Bpbm5pbmcgPSByZWYoZmFsc2UpOwogICAgY29uc3QgZGVsYXlUaW1lID0gNTAwOwogICAgY29uc3QgY2hhbmdlU3Bpbm5pbmcgPSAoKSA9PiB7CiAgICAgIHNwaW5uaW5nLnZhbHVlID0gIXNwaW5uaW5nLnZhbHVlOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHNwaW5uaW5nLAogICAgICBkZWxheVRpbWUsCiAgICAgIGNoYW5nZVNwaW5uaW5nLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBzY29wZWQ+Ci5zcGluLXN0YXRlIHsKICBtYXJnaW4tdG9wOiAxNnB4Owp9Cjwvc3R5bGU+"}},{default:e(()=>[p(g,{spinning:o.spinning,delay:o.delayTime},{default:e(()=>[p(d,{message:"Alert message title",description:"Further details about the context of this alert."})]),_:1},8,["spinning","delay"]),n("div",J,[s[1]||(s[1]=a(" Loading state\uFF1A ")),p(m,{checked:o.spinning,"onUpdate:checked":s[0]||(s[0]=C=>o.spinning=C)},null,8,["checked"])])]),htmlCode:e(()=>s[2]||(s[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},":spinning"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spinning"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":delay"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("delayTime"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-alert")]),a(`
- `),n("span",{class:"token attr-name"},"message"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Alert message title"),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token attr-name"},"description"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Further details about the context of this alert."),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-alert")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-spin")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spin-state"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- Loading state\uFF1A
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-switch")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spinning"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
- `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token keyword"},"const"),a(" spinning "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"const"),a(" delayTime "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token number"},"500"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"changeSpinning"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
- spinning`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"!"),a("spinning"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
- spinning`),n("span",{class:"token punctuation"},","),a(`
- delayTime`),n("span",{class:"token punctuation"},","),a(`
- changeSpinning`),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
- `),n("span",{class:"token selector"},".spin-state"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),jsVersionHtml:e(()=>s[3]||(s[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},":spinning"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spinning"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":delay"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("delayTime"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-alert")]),a(`
- `),n("span",{class:"token attr-name"},"message"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Alert message title"),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token attr-name"},"description"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Further details about the context of this alert."),n("span",{class:"token punctuation"},'"')]),a(`
- `),n("span",{class:"token punctuation"},">")]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-alert")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-spin")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spin-state"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
- Loading state\uFF1A
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-switch")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("spinning"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
- `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token keyword"},"const"),a(" spinning "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"const"),a(" delayTime "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token number"},"500"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"changeSpinning"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
- spinning`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"!"),a("spinning"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
- spinning`),n("span",{class:"token punctuation"},","),a(`
- delayTime`),n("span",{class:"token punctuation"},","),a(`
- changeSpinning`),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
- `),n("span",{class:"token selector"},".spin-state"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),_:1})}const Q=u(U,[["render",T],["__scopeId","data-v-ce2ddbf5"]]),O=b({setup(){return{indicator:B(G,{style:{fontSize:"24px"},spin:!0})}}});function $(o,s,c,l,k,h){const d=t("a-spin"),g=t("demo-box");return i(),r(g,{jsfiddle:{us:"Use custom loading indicator.",cn:"\u4F7F\u7528\u81EA\u5B9A\u4E49\u6307\u793A\u7B26\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>\u4F7F\u7528\u81EA\u5B9A\u4E49\u6307\u793A\u7B26\u3002</p>
- <h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>Use custom loading indicator.</p>
- `,order:6,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u6307\u793A\u7B26","en-US":"Custom spinning indicator"},relativePath:"components/spin/demo/custom-indicator.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwaW4gOmluZGljYXRvcj0iaW5kaWNhdG9yIiAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgTG9hZGluZ091dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCBoIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IGluZGljYXRvciA9IGgoTG9hZGluZ091dGxpbmVkLCB7CiAgICAgIHN0eWxlOiB7CiAgICAgICAgZm9udFNpemU6ICcyNHB4JywKICAgICAgfSwKICAgICAgc3BpbjogdHJ1ZSwKICAgIH0pOwogICAgcmV0dXJuIHsKICAgICAgaW5kaWNhdG9yLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwaW4gOmluZGljYXRvcj0iaW5kaWNhdG9yIiAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBMb2FkaW5nT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIGggfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgaW5kaWNhdG9yID0gaChMb2FkaW5nT3V0bGluZWQsIHsKICAgICAgc3R5bGU6IHsKICAgICAgICBmb250U2l6ZTogJzI0cHgnLAogICAgICB9LAogICAgICBzcGluOiB0cnVlLAogICAgfSk7CiAgICByZXR1cm4gewogICAgICBpbmRpY2F0b3IsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:e(()=>[p(d,{indicator:o.indicator},null,8,["indicator"])]),htmlCode:e(()=>s[0]||(s[0]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},":indicator"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("indicator"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
- `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" LoadingOutlined "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" h "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token keyword"},"const"),a(" indicator "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),a("LoadingOutlined"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token literal-property property"},"style"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token literal-property property"},"fontSize"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'24px'"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token literal-property property"},"spin"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
- indicator`),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),jsVersionHtml:e(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-spin")]),a(),n("span",{class:"token attr-name"},":indicator"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("indicator"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
- `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
- `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" LoadingOutlined "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" h "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token keyword"},"const"),a(" indicator "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"h"),n("span",{class:"token punctuation"},"("),a("LoadingOutlined"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token literal-property property"},"style"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
- `),n("span",{class:"token literal-property property"},"fontSize"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'24px'"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token literal-property property"},"spin"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
- indicator`),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
- `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
- `)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
- `)])],-1)])),_:1})}const q=u(O,[["render",$]]),E={pageData:{title:"Spin",description:"",frontmatter:{category:"Components",type:"\u53CD\u9988",title:"Spin",subtitle:"\u52A0\u8F7D\u4E2D",cover:"https://gw.alipayobjects.com/zos/alicdn/8emPa3fjl/Alert.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:"\u9875\u9762\u5C40\u90E8\u5904\u4E8E\u7B49\u5F85\u5F02\u6B65\u6570\u636E\u6216\u6B63\u5728\u6E32\u67D3\u8FC7\u7A0B\u65F6\uFF0C\u5408\u9002\u7684\u52A0\u8F7D\u52A8\u6548\u4F1A\u6709\u6548\u7F13\u89E3\u7528\u6237\u7684\u7126\u8651\u3002"},{level:2,title:"API",slug:"API",content:""},{level:3,title:"\u9759\u6001\u65B9\u6CD5",slug:"\u9759\u6001\u65B9\u6CD5",content:""}],relativePath:"components/spin/index.zh-CN.md",content:`
- \u7528\u4E8E\u9875\u9762\u548C\u533A\u5757\u7684\u52A0\u8F7D\u4E2D\u72B6\u6001\u3002
- ## \u4F55\u65F6\u4F7F\u7528
- \u9875\u9762\u5C40\u90E8\u5904\u4E8E\u7B49\u5F85\u5F02\u6B65\u6570\u636E\u6216\u6B63\u5728\u6E32\u67D3\u8FC7\u7A0B\u65F6\uFF0C\u5408\u9002\u7684\u52A0\u8F7D\u52A8\u6548\u4F1A\u6709\u6548\u7F13\u89E3\u7528\u6237\u7684\u7126\u8651\u3002
- ## API
- | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
- | --- | --- | --- | --- | --- |
- | delay | \u5EF6\u8FDF\u663E\u793A\u52A0\u8F7D\u6548\u679C\u7684\u65F6\u95F4\uFF08\u9632\u6B62\u95EA\u70C1\uFF09 | number (\u6BEB\u79D2) | - | |
- | indicator | \u52A0\u8F7D\u6307\u793A\u7B26 | vNode \\| slot | - | |
- | size | \u7EC4\u4EF6\u5927\u5C0F\uFF0C\u53EF\u9009\u503C\u4E3A \`small\` \`default\` \`large\` | string | \`default\` | |
- | spinning | \u662F\u5426\u4E3A\u52A0\u8F7D\u4E2D\u72B6\u6001 | boolean | true | |
- | tip | \u5F53\u4F5C\u4E3A\u5305\u88F9\u5143\u7D20\u65F6\uFF0C\u53EF\u4EE5\u81EA\u5B9A\u4E49\u63CF\u8FF0\u6587\u6848 | string \\| slot | - | slot 3.0 |
- | wrapperClassName | \u5305\u88C5\u5668\u7684\u7C7B\u5C5E\u6027 | string | - | |
- ### \u9759\u6001\u65B9\u6CD5
- - \`Spin.setDefaultIndicator({indicator})\` \u540C\u4E0A \`indicator\`\uFF0C\u4F60\u53EF\u4EE5\u81EA\u5B9A\u4E49\u5168\u5C40\u9ED8\u8BA4\u5143\u7D20
- \`\`\`jsx
- import { h } from 'vue';
- Spin.setDefaultIndicator({
- indicator: h('i', { class: 'anticon anticon-loading anticon-spin ant-spin-dot' }),
- });
- \`\`\`
- `,html:`<p>\u7528\u4E8E\u9875\u9762\u548C\u533A\u5757\u7684\u52A0\u8F7D\u4E2D\u72B6\u6001\u3002</p>
- <h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>\u9875\u9762\u5C40\u90E8\u5904\u4E8E\u7B49\u5F85\u5F02\u6B65\u6570\u636E\u6216\u6B63\u5728\u6E32\u67D3\u8FC7\u7A0B\u65F6\uFF0C\u5408\u9002\u7684\u52A0\u8F7D\u52A8\u6548\u4F1A\u6709\u6548\u7F13\u89E3\u7528\u6237\u7684\u7126\u8651\u3002</p>
- <h2 id="API">API <a class="header-anchor" href="#API">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <table>
- <thead>
- <tr>
- <th>\u53C2\u6570</th>
- <th>\u8BF4\u660E</th>
- <th>\u7C7B\u578B</th>
- <th>\u9ED8\u8BA4\u503C</th>
- <th>\u7248\u672C</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>delay</td>
- <td>\u5EF6\u8FDF\u663E\u793A\u52A0\u8F7D\u6548\u679C\u7684\u65F6\u95F4\uFF08\u9632\u6B62\u95EA\u70C1\uFF09</td>
- <td>number (\u6BEB\u79D2)</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>indicator</td>
- <td>\u52A0\u8F7D\u6307\u793A\u7B26</td>
- <td>vNode | slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>size</td>
- <td>\u7EC4\u4EF6\u5927\u5C0F\uFF0C\u53EF\u9009\u503C\u4E3A <code>small</code> <code>default</code> <code>large</code></td>
- <td>string</td>
- <td><code>default</code></td>
- <td></td>
- </tr>
- <tr>
- <td>spinning</td>
- <td>\u662F\u5426\u4E3A\u52A0\u8F7D\u4E2D\u72B6\u6001</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>tip</td>
- <td>\u5F53\u4F5C\u4E3A\u5305\u88F9\u5143\u7D20\u65F6\uFF0C\u53EF\u4EE5\u81EA\u5B9A\u4E49\u63CF\u8FF0\u6587\u6848</td>
- <td>string | slot</td>
- <td>-</td>
- <td>slot 3.0</td>
- </tr>
- <tr>
- <td>wrapperClassName</td>
- <td>\u5305\u88C5\u5668\u7684\u7C7B\u5C5E\u6027</td>
- <td>string</td>
- <td>-</td>
- <td></td>
- </tr>
- </tbody>
- </table>
- <h3 id="\u9759\u6001\u65B9\u6CD5">\u9759\u6001\u65B9\u6CD5 <a class="header-anchor" href="#\u9759\u6001\u65B9\u6CD5">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h3>
- <ul>
- <li>
- <p><code>Spin.setDefaultIndicator({indicator})</code> \u540C\u4E0A <code>indicator</code>\uFF0C\u4F60\u53EF\u4EE5\u81EA\u5B9A\u4E49\u5168\u5C40\u9ED8\u8BA4\u5143\u7D20</p>
- <pre class="language-jsx" v-pre><code><span class="token keyword">import</span> <span class="token punctuation">{</span> h <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'vue'</span><span class="token punctuation">;</span>
- Spin<span class="token punctuation">.</span><span class="token function">setDefaultIndicator</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
- <span class="token literal-property property">indicator</span><span class="token operator">:</span> <span class="token function">h</span><span class="token punctuation">(</span><span class="token string">'i'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> <span class="token keyword">class</span><span class="token operator">:</span> <span class="token string">'anticon anticon-loading anticon-spin ant-spin-dot'</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
- <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
- </code></pre>
- </li>
- </ul>
- `,lastUpdated:1748060301220}},M={class:"markdown"};function nn(o,s,c,l,k,h){return i(),A("article",M,s[0]||(s[0]=[y(`<p>\u7528\u4E8E\u9875\u9762\u548C\u533A\u5757\u7684\u52A0\u8F7D\u4E2D\u72B6\u6001\u3002</p><h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528"><span aria-hidden="true" class="anchor">#</span></a></h2><p>\u9875\u9762\u5C40\u90E8\u5904\u4E8E\u7B49\u5F85\u5F02\u6B65\u6570\u636E\u6216\u6B63\u5728\u6E32\u67D3\u8FC7\u7A0B\u65F6\uFF0C\u5408\u9002\u7684\u52A0\u8F7D\u52A8\u6548\u4F1A\u6709\u6548\u7F13\u89E3\u7528\u6237\u7684\u7126\u8651\u3002</p><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th><th>\u7248\u672C</th></tr></thead><tbody><tr><td>delay</td><td>\u5EF6\u8FDF\u663E\u793A\u52A0\u8F7D\u6548\u679C\u7684\u65F6\u95F4\uFF08\u9632\u6B62\u95EA\u70C1\uFF09</td><td>number (\u6BEB\u79D2)</td><td>-</td><td></td></tr><tr><td>indicator</td><td>\u52A0\u8F7D\u6307\u793A\u7B26</td><td>vNode | slot</td><td>-</td><td></td></tr><tr><td>size</td><td>\u7EC4\u4EF6\u5927\u5C0F\uFF0C\u53EF\u9009\u503C\u4E3A <code>small</code> <code>default</code> <code>large</code></td><td>string</td><td><code>default</code></td><td></td></tr><tr><td>spinning</td><td>\u662F\u5426\u4E3A\u52A0\u8F7D\u4E2D\u72B6\u6001</td><td>boolean</td><td>true</td><td></td></tr><tr><td>tip</td><td>\u5F53\u4F5C\u4E3A\u5305\u88F9\u5143\u7D20\u65F6\uFF0C\u53EF\u4EE5\u81EA\u5B9A\u4E49\u63CF\u8FF0\u6587\u6848</td><td>string | slot</td><td>-</td><td>slot 3.0</td></tr><tr><td>wrapperClassName</td><td>\u5305\u88C5\u5668\u7684\u7C7B\u5C5E\u6027</td><td>string</td><td>-</td><td></td></tr></tbody></table><h3 id="\u9759\u6001\u65B9\u6CD5">\u9759\u6001\u65B9\u6CD5 <a class="header-anchor" href="#\u9759\u6001\u65B9\u6CD5"><span aria-hidden="true" class="anchor">#</span></a></h3><ul><li><p><code>Spin.setDefaultIndicator({indicator})</code> \u540C\u4E0A <code>indicator</code>\uFF0C\u4F60\u53EF\u4EE5\u81EA\u5B9A\u4E49\u5168\u5C40\u9ED8\u8BA4\u5143\u7D20</p><pre class="language-jsx"><code><span class="token keyword">import</span> <span class="token punctuation">{</span> h <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'vue'</span><span class="token punctuation">;</span>
- Spin<span class="token punctuation">.</span><span class="token function">setDefaultIndicator</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
- <span class="token literal-property property">indicator</span><span class="token operator">:</span> <span class="token function">h</span><span class="token punctuation">(</span><span class="token string">'i'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> <span class="token keyword">class</span><span class="token operator">:</span> <span class="token string">'anticon anticon-loading anticon-spin ant-spin-dot'</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
- <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
- </code></pre></li></ul>`,7)]))}const an=u(E,[["render",nn]]),sn={pageData:{title:"Spin",description:"",frontmatter:{category:"Components",type:"Feedback",title:"Spin",cover:"https://gw.alipayobjects.com/zos/alicdn/LBcJqCPRv/Spin.svg"},headers:[{level:2,title:"When To Use",slug:"When-To-Use",content:"When part of the page is waiting for asynchronous data or during a rendering process, an appropriate loading animation can effectively alleviate users' inquietude."},{level:2,title:"API",slug:"API",content:""},{level:3,title:"Static Method",slug:"Static-Method",content:""}],relativePath:"components/spin/index.en-US.md",content:`
- A spinner for displaying loading state of a page or a section.
- ## When To Use
- When part of the page is waiting for asynchronous data or during a rendering process, an appropriate loading animation can effectively alleviate users' inquietude.
- ## API
- | Property | Description | Type | Default Value | Version |
- | --- | --- | --- | --- | --- |
- | delay | specifies a delay in milliseconds for loading state (prevent flush) | number (milliseconds) | - | |
- | indicator | vue node of the spinning indicator | vNode \\|slot | - | |
- | size | size of Spin, options: \`small\`, \`default\` and \`large\` | string | \`default\` | |
- | spinning | whether Spin is spinning | boolean | true | |
- | tip | customize description content when Spin has children | string \\| slot | - | slot 3.0 |
- | wrapperClassName | className of wrapper when Spin has children | string | - | |
- ### Static Method
- - \`Spin.setDefaultIndicator({indicator})\` As \`indicator\`, you can define the global default spin element
- \`\`\`jsx
- import { h } from 'vue';
- Spin.setDefaultIndicator({
- indicator: h('i', { class: 'anticon anticon-loading anticon-spin ant-spin-dot' }),
- });
- \`\`\`
- `,html:`<p>A spinner for displaying loading state of a page or a section.</p>
- <h2 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <p>When part of the page is waiting for asynchronous data or during a rendering process, an appropriate loading animation can effectively alleviate users' inquietude.</p>
- <h2 id="API">API <a class="header-anchor" href="#API">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h2>
- <table>
- <thead>
- <tr>
- <th>Property</th>
- <th>Description</th>
- <th>Type</th>
- <th>Default Value</th>
- <th>Version</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>delay</td>
- <td>specifies a delay in milliseconds for loading state (prevent flush)</td>
- <td>number (milliseconds)</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>indicator</td>
- <td>vue node of the spinning indicator</td>
- <td>vNode |slot</td>
- <td>-</td>
- <td></td>
- </tr>
- <tr>
- <td>size</td>
- <td>size of Spin, options: <code>small</code>, <code>default</code> and <code>large</code></td>
- <td>string</td>
- <td><code>default</code></td>
- <td></td>
- </tr>
- <tr>
- <td>spinning</td>
- <td>whether Spin is spinning</td>
- <td>boolean</td>
- <td>true</td>
- <td></td>
- </tr>
- <tr>
- <td>tip</td>
- <td>customize description content when Spin has children</td>
- <td>string | slot</td>
- <td>-</td>
- <td>slot 3.0</td>
- </tr>
- <tr>
- <td>wrapperClassName</td>
- <td>className of wrapper when Spin has children</td>
- <td>string</td>
- <td>-</td>
- <td></td>
- </tr>
- </tbody>
- </table>
- <h3 id="Static-Method">Static Method <a class="header-anchor" href="#Static-Method">
- <span aria-hidden="true" class="anchor">#</span>
- </a></h3>
- <ul>
- <li><code>Spin.setDefaultIndicator({indicator})</code> As <code>indicator</code>, you can define the global default spin element</li>
- </ul>
- <pre class="language-jsx" v-pre><code><span class="token keyword">import</span> <span class="token punctuation">{</span> h <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'vue'</span><span class="token punctuation">;</span>
- Spin<span class="token punctuation">.</span><span class="token function">setDefaultIndicator</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
- <span class="token literal-property property">indicator</span><span class="token operator">:</span> <span class="token function">h</span><span class="token punctuation">(</span><span class="token string">'i'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> <span class="token keyword">class</span><span class="token operator">:</span> <span class="token string">'anticon anticon-loading anticon-spin ant-spin-dot'</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
- <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
- </code></pre>
- `,lastUpdated:1748060301220}},tn={class:"markdown"};function on(o,s,c,l,k,h){return i(),A("article",tn,s[0]||(s[0]=[y(`<p>A spinner for displaying loading state of a page or a section.</p><h2 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use"><span aria-hidden="true" class="anchor">#</span></a></h2><p>When part of the page is waiting for asynchronous data or during a rendering process, an appropriate loading animation can effectively alleviate users' inquietude.</p><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default Value</th><th>Version</th></tr></thead><tbody><tr><td>delay</td><td>specifies a delay in milliseconds for loading state (prevent flush)</td><td>number (milliseconds)</td><td>-</td><td></td></tr><tr><td>indicator</td><td>vue node of the spinning indicator</td><td>vNode |slot</td><td>-</td><td></td></tr><tr><td>size</td><td>size of Spin, options: <code>small</code>, <code>default</code> and <code>large</code></td><td>string</td><td><code>default</code></td><td></td></tr><tr><td>spinning</td><td>whether Spin is spinning</td><td>boolean</td><td>true</td><td></td></tr><tr><td>tip</td><td>customize description content when Spin has children</td><td>string | slot</td><td>-</td><td>slot 3.0</td></tr><tr><td>wrapperClassName</td><td>className of wrapper when Spin has children</td><td>string</td><td>-</td><td></td></tr></tbody></table><h3 id="Static-Method">Static Method <a class="header-anchor" href="#Static-Method"><span aria-hidden="true" class="anchor">#</span></a></h3><ul><li><code>Spin.setDefaultIndicator({indicator})</code> As <code>indicator</code>, you can define the global default spin element</li></ul><pre class="language-jsx"><code><span class="token keyword">import</span> <span class="token punctuation">{</span> h <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">'vue'</span><span class="token punctuation">;</span>
- Spin<span class="token punctuation">.</span><span class="token function">setDefaultIndicator</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
- <span class="token literal-property property">indicator</span><span class="token operator">:</span> <span class="token function">h</span><span class="token punctuation">(</span><span class="token string">'i'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> <span class="token keyword">class</span><span class="token operator">:</span> <span class="token string">'anticon anticon-loading anticon-spin ant-spin-dot'</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span>
- <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
- </code></pre>`,8)]))}const en=u(sn,[["render",on]]),pn=b({CN:an,US:en,components:{Basic:S,Size:_,Inside:R,Nested:V,Tip:j,Delay:Q,CustomIndicator:q},setup(){return{}}});function cn(o,s,c,l,k,h){const d=t("basic"),g=t("size"),m=t("inside"),I=t("nested"),C=t("tip"),v=t("delay"),w=t("custom-indicator"),W=t("demo-sort");return i(),r(W,null,{default:e(()=>[p(d),p(g),p(m),p(I),p(C),p(v),p(w)]),_:1})}const un=u(pn,[["render",cn]]);export{un as default};
|