import{d as I,r as A,_ as d,l as m,w as o,j as c,k as g,f as e,e as a,b as n,J as W,y as G,K as f,c as B,t as Z,a as w,q as x}from"./index.3fe853a6.js";const P=I({setup(){return{checked:A(!1)}}});function N(s,t,k,i,r,h){const l=c("a-checkbox"),u=c("demo-box");return g(),m(u,{jsfiddle:{us:"Basic usage of checkbox",cn:"\u7B80\u5355\u7684 checkbox",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u7B80\u5355\u7684 checkbox</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Basic usage of checkbox</p>
`,order:0,title:{"zh-CN":"\u57FA\u672C\u7528\u6CD5","en-US":"Basic"},relativePath:"components/checkbox/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWNoZWNrYm94IHYtbW9kZWw6Y2hlY2tlZD0iY2hlY2tlZCI+Q2hlY2tib3g8L2EtY2hlY2tib3g+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBjaGVja2VkOiByZWYoZmFsc2UpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWNoZWNrYm94IHYtbW9kZWw6Y2hlY2tlZD0iY2hlY2tlZCI+Q2hlY2tib3g8L2EtY2hlY2tib3g+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIGNoZWNrZWQ6IHJlZihmYWxzZSksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[e(l,{checked:s.checked,"onUpdate:checked":t[0]||(t[0]=p=>s.checked=p)},{default:o(()=>t[1]||(t[1]=[a("Checkbox")])),_:1,__:[1]},8,["checked"])]),htmlCode:o(()=>t[2]||(t[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-checkbox")]),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("checked"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Checkbox"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),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"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"checked"),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 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:o(()=>t[3]||(t[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-checkbox")]),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("checked"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Checkbox"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),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"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"checked"),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 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 H=d(P,[["render",N]]),v=["Apple","Pear","Orange"],V=I({setup(){const s=W({indeterminate:!0,checkAll:!1,checkedList:["Apple","Orange"]}),t=k=>{Object.assign(s,{checkedList:k.target.checked?v:[],indeterminate:!1})};return G(()=>s.checkedList,k=>{s.indeterminate=!!k.length&&k.length<v.length,s.checkAll=k.length===v.length}),{...f(s),plainOptions:v,onCheckAllChange:t}}});function S(s,t,k,i,r,h){const l=c("a-checkbox"),u=c("a-divider"),p=c("a-checkbox-group"),b=c("demo-box");return g(),m(b,{jsfiddle:{us:"The `indeterminate` property can help you to achieve a 'check all' effect.",cn:"\u5728\u5B9E\u73B0\u5168\u9009\u6548\u679C\u65F6\uFF0C\u4F60\u53EF\u80FD\u4F1A\u7528\u5230 `indeterminate` \u5C5E\u6027",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u5728\u5B9E\u73B0\u5168\u9009\u6548\u679C\u65F6\uFF0C\u4F60\u53EF\u80FD\u4F1A\u7528\u5230 <code>indeterminate</code> \u5C5E\u6027</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>The <code>indeterminate</code> property can help you to achieve a 'check all' effect.</p>
`,order:1,title:{"zh-CN":"\u5168\u9009","en-US":"Check all"},relativePath:"components/checkbox/demo/check-all.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1jaGVja2JveAogICAgICB2LW1vZGVsOmNoZWNrZWQ9ImNoZWNrQWxsIgogICAgICA6aW5kZXRlcm1pbmF0ZT0iaW5kZXRlcm1pbmF0ZSIKICAgICAgQGNoYW5nZT0ib25DaGVja0FsbENoYW5nZSIKICAgID4KICAgICAgQ2hlY2sgYWxsCiAgICA8L2EtY2hlY2tib3g+CiAgPC9kaXY+CiAgPGEtZGl2aWRlciAvPgogIDxhLWNoZWNrYm94LWdyb3VwIHYtbW9kZWw6dmFsdWU9ImNoZWNrZWRMaXN0IiA6b3B0aW9ucz0icGxhaW5PcHRpb25zIiAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWFjdGl2ZSwgdG9SZWZzLCB3YXRjaCB9IGZyb20gJ3Z1ZSc7CmNvbnN0IHBsYWluT3B0aW9ucyA9IFsnQXBwbGUnLCAnUGVhcicsICdPcmFuZ2UnXTsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHN0YXRlID0gcmVhY3RpdmUoewogICAgICBpbmRldGVybWluYXRlOiB0cnVlLAogICAgICBjaGVja0FsbDogZmFsc2UsCiAgICAgIGNoZWNrZWRMaXN0OiBbJ0FwcGxlJywgJ09yYW5nZSddLAogICAgfSk7CgogICAgY29uc3Qgb25DaGVja0FsbENoYW5nZSA9IChlOiBhbnkpID0+IHsKICAgICAgT2JqZWN0LmFzc2lnbihzdGF0ZSwgewogICAgICAgIGNoZWNrZWRMaXN0OiBlLnRhcmdldC5jaGVja2VkID8gcGxhaW5PcHRpb25zIDogW10sCiAgICAgICAgaW5kZXRlcm1pbmF0ZTogZmFsc2UsCiAgICAgIH0pOwogICAgfTsKICAgIHdhdGNoKAogICAgICAoKSA9PiBzdGF0ZS5jaGVja2VkTGlzdCwKICAgICAgdmFsID0+IHsKICAgICAgICBzdGF0ZS5pbmRldGVybWluYXRlID0gISF2YWwubGVuZ3RoICYmIHZhbC5sZW5ndGggPCBwbGFpbk9wdGlvbnMubGVuZ3RoOwogICAgICAgIHN0YXRlLmNoZWNrQWxsID0gdmFsLmxlbmd0aCA9PT0gcGxhaW5PcHRpb25zLmxlbmd0aDsKICAgICAgfSwKICAgICk7CgogICAgcmV0dXJuIHsKICAgICAgLi4udG9SZWZzKHN0YXRlKSwKICAgICAgcGxhaW5PcHRpb25zLAogICAgICBvbkNoZWNrQWxsQ2hhbmdlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1jaGVja2JveAogICAgICB2LW1vZGVsOmNoZWNrZWQ9ImNoZWNrQWxsIgogICAgICA6aW5kZXRlcm1pbmF0ZT0iaW5kZXRlcm1pbmF0ZSIKICAgICAgQGNoYW5nZT0ib25DaGVja0FsbENoYW5nZSIKICAgID4KICAgICAgQ2hlY2sgYWxsCiAgICA8L2EtY2hlY2tib3g+CiAgPC9kaXY+CiAgPGEtZGl2aWRlciAvPgogIDxhLWNoZWNrYm94LWdyb3VwIHYtbW9kZWw6dmFsdWU9ImNoZWNrZWRMaXN0IiA6b3B0aW9ucz0icGxhaW5PcHRpb25zIiAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlYWN0aXZlLCB0b1JlZnMsIHdhdGNoIH0gZnJvbSAndnVlJzsKY29uc3QgcGxhaW5PcHRpb25zID0gWydBcHBsZScsICdQZWFyJywgJ09yYW5nZSddOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgc3RhdGUgPSByZWFjdGl2ZSh7CiAgICAgIGluZGV0ZXJtaW5hdGU6IHRydWUsCiAgICAgIGNoZWNrQWxsOiBmYWxzZSwKICAgICAgY2hlY2tlZExpc3Q6IFsnQXBwbGUnLCAnT3JhbmdlJ10sCiAgICB9KTsKICAgIGNvbnN0IG9uQ2hlY2tBbGxDaGFuZ2UgPSBlID0+IHsKICAgICAgT2JqZWN0LmFzc2lnbihzdGF0ZSwgewogICAgICAgIGNoZWNrZWRMaXN0OiBlLnRhcmdldC5jaGVja2VkID8gcGxhaW5PcHRpb25zIDogW10sCiAgICAgICAgaW5kZXRlcm1pbmF0ZTogZmFsc2UsCiAgICAgIH0pOwogICAgfTsKICAgIHdhdGNoKCgpID0+IHN0YXRlLmNoZWNrZWRMaXN0LCB2YWwgPT4gewogICAgICBzdGF0ZS5pbmRldGVybWluYXRlID0gISF2YWwubGVuZ3RoICYmIHZhbC5sZW5ndGggPCBwbGFpbk9wdGlvbnMubGVuZ3RoOwogICAgICBzdGF0ZS5jaGVja0FsbCA9IHZhbC5sZW5ndGggPT09IHBsYWluT3B0aW9ucy5sZW5ndGg7CiAgICB9KTsKICAgIHJldHVybiB7CiAgICAgIC4uLnRvUmVmcyhzdGF0ZSksCiAgICAgIHBsYWluT3B0aW9ucywKICAgICAgb25DaGVja0FsbENoYW5nZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[n("div",null,[e(l,{checked:s.checkAll,"onUpdate:checked":t[0]||(t[0]=C=>s.checkAll=C),indeterminate:s.indeterminate,onChange:s.onCheckAllChange},{default:o(()=>t[2]||(t[2]=[a(" Check all ")])),_:1,__:[2]},8,["checked","indeterminate","onChange"])]),e(u),e(p,{value:s.checkedList,"onUpdate:value":t[1]||(t[1]=C=>s.checkedList=C),options:s.plainOptions},null,8,["value","options"])]),htmlCode:o(()=>t[3]||(t[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("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox")]),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("checkAll"),n("span",{class:"token punctuation"},'"')]),a(`
      `),n("span",{class:"token attr-name"},":indeterminate"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("indeterminate"),n("span",{class:"token punctuation"},'"')]),a(`
      `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onCheckAllChange"),n("span",{class:"token punctuation"},'"')]),a(`
    `),n("span",{class:"token punctuation"},">")]),a(`
      Check all
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),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("a-divider")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("checkedList"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("plainOptions"),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(" defineComponent"),n("span",{class:"token punctuation"},","),a(" reactive"),n("span",{class:"token punctuation"},","),a(" toRefs"),n("span",{class:"token punctuation"},","),a(" watch "),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"},"const"),a(" plainOptions "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'Orange'"),n("span",{class:"token punctuation"},"]"),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(" state "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"indeterminate"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"checkAll"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"checkedList"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'Orange'"),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 keyword"},"const"),a(),n("span",{class:"token function-variable function"},"onCheckAllChange"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"e"),n("span",{class:"token operator"},":"),a(" any")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      Object`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"assign"),n("span",{class:"token punctuation"},"("),a("state"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"checkedList"),n("span",{class:"token operator"},":"),a(" e"),n("span",{class:"token punctuation"},"."),a("target"),n("span",{class:"token punctuation"},"."),a("checked "),n("span",{class:"token operator"},"?"),a(" plainOptions "),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"indeterminate"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"false"),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 punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),a(`
      `),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(" state"),n("span",{class:"token punctuation"},"."),a("checkedList"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token parameter"},"val"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
        state`),n("span",{class:"token punctuation"},"."),a("indeterminate "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"!"),n("span",{class:"token operator"},"!"),a("val"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"&&"),a(" val"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"<"),a(" plainOptions"),n("span",{class:"token punctuation"},"."),a("length"),n("span",{class:"token punctuation"},";"),a(`
        state`),n("span",{class:"token punctuation"},"."),a("checkAll "),n("span",{class:"token operator"},"="),a(" val"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"==="),a(" plainOptions"),n("span",{class:"token punctuation"},"."),a("length"),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 keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"toRefs"),n("span",{class:"token punctuation"},"("),a("state"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
      plainOptions`),n("span",{class:"token punctuation"},","),a(`
      onCheckAllChange`),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:o(()=>t[4]||(t[4]=[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")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox")]),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("checkAll"),n("span",{class:"token punctuation"},'"')]),a(`
      `),n("span",{class:"token attr-name"},":indeterminate"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("indeterminate"),n("span",{class:"token punctuation"},'"')]),a(`
      `),n("span",{class:"token attr-name"},"@change"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onCheckAllChange"),n("span",{class:"token punctuation"},'"')]),a(`
    `),n("span",{class:"token punctuation"},">")]),a(`
      Check all
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),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("a-divider")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("checkedList"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("plainOptions"),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(" defineComponent"),n("span",{class:"token punctuation"},","),a(" reactive"),n("span",{class:"token punctuation"},","),a(" toRefs"),n("span",{class:"token punctuation"},","),a(" watch "),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"},"const"),a(" plainOptions "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'Orange'"),n("span",{class:"token punctuation"},"]"),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(" state "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"indeterminate"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"checkAll"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"checkedList"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'Orange'"),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 keyword"},"const"),a(),n("span",{class:"token function-variable function"},"onCheckAllChange"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token parameter"},"e"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      Object`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"assign"),n("span",{class:"token punctuation"},"("),a("state"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"checkedList"),n("span",{class:"token operator"},":"),a(" e"),n("span",{class:"token punctuation"},"."),a("target"),n("span",{class:"token punctuation"},"."),a("checked "),n("span",{class:"token operator"},"?"),a(" plainOptions "),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"indeterminate"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"false"),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 punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(" state"),n("span",{class:"token punctuation"},"."),a("checkedList"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token parameter"},"val"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      state`),n("span",{class:"token punctuation"},"."),a("indeterminate "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"!"),n("span",{class:"token operator"},"!"),a("val"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"&&"),a(" val"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"<"),a(" plainOptions"),n("span",{class:"token punctuation"},"."),a("length"),n("span",{class:"token punctuation"},";"),a(`
      state`),n("span",{class:"token punctuation"},"."),a("checkAll "),n("span",{class:"token operator"},"="),a(" val"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"==="),a(" plainOptions"),n("span",{class:"token punctuation"},"."),a("length"),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(`
      `),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"toRefs"),n("span",{class:"token punctuation"},"("),a("state"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
      plainOptions`),n("span",{class:"token punctuation"},","),a(`
      onCheckAllChange`),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 D=d(V,[["render",S]]),J=I({setup(){const s=A(!1),t=A(!1),k=()=>{s.value=!s.value},i=()=>{t.value=!t.value};return{label:B(()=>`${s.value?"Checked":"Unchecked"}-${t.value?"Disabled":"Enabled"}`),checked:s,disabled:t,toggleChecked:k,toggleDisable:i}}}),F={style:{marginBottom:"20px"}};function L(s,t,k,i,r,h){const l=c("a-checkbox"),u=c("a-button"),p=c("demo-box");return g(),m(p,{jsfiddle:{us:"Communicated with other components",cn:"\u8054\u52A8checkbox",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u8054\u52A8checkbox</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Communicated with other components</p>
`,order:2,title:{"zh-CN":"\u53D7\u63A7\u7684 checkbox","en-US":"Controlled Checkbox"},relativePath:"components/checkbox/demo/controller.vue",sourceCode:"PHRlbXBsYXRlPgogIDxwIDpzdHlsZT0ieyBtYXJnaW5Cb3R0b206ICcyMHB4JyB9Ij4KICAgIDxhLWNoZWNrYm94IHYtbW9kZWw6Y2hlY2tlZD0iY2hlY2tlZCIgOmRpc2FibGVkPSJkaXNhYmxlZCI+CiAgICAgIHt7IGxhYmVsIH19CiAgICA8L2EtY2hlY2tib3g+CiAgPC9wPgogIDxwPgogICAgPGEtYnV0dG9uIHR5cGU9InByaW1hcnkiIHNpemU9InNtYWxsIiBAY2xpY2s9InRvZ2dsZUNoZWNrZWQiPgogICAgICB7eyAhY2hlY2tlZCA/ICdDaGVjaycgOiAnVW5jaGVjaycgfX0KICAgIDwvYS1idXR0b24+CiAgICA8YS1idXR0b24gOnN0eWxlPSJ7IG1hcmdpbkxlZnQ6ICcxMHB4JyB9IiB0eXBlPSJwcmltYXJ5IiBzaXplPSJzbWFsbCIgQGNsaWNrPSJ0b2dnbGVEaXNhYmxlIj4KICAgICAge3sgIWRpc2FibGVkID8gJ0Rpc2FibGUnIDogJ0VuYWJsZScgfX0KICAgIDwvYS1idXR0b24+CiAgPC9wPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgY29tcHV0ZWQsIGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IGNoZWNrZWQgPSByZWYoZmFsc2UpOwogICAgY29uc3QgZGlzYWJsZWQgPSByZWYoZmFsc2UpOwoKICAgIGNvbnN0IHRvZ2dsZUNoZWNrZWQgPSAoKSA9PiB7CiAgICAgIGNoZWNrZWQudmFsdWUgPSAhY2hlY2tlZC52YWx1ZTsKICAgIH07CgogICAgY29uc3QgdG9nZ2xlRGlzYWJsZSA9ICgpID0+IHsKICAgICAgZGlzYWJsZWQudmFsdWUgPSAhZGlzYWJsZWQudmFsdWU7CiAgICB9OwoKICAgIGNvbnN0IGxhYmVsID0gY29tcHV0ZWQoKCkgPT4gewogICAgICByZXR1cm4gYCR7Y2hlY2tlZC52YWx1ZSA/ICdDaGVja2VkJyA6ICdVbmNoZWNrZWQnfS0kewogICAgICAgIGRpc2FibGVkLnZhbHVlID8gJ0Rpc2FibGVkJyA6ICdFbmFibGVkJwogICAgICB9YDsKICAgIH0pOwoKICAgIHJldHVybiB7CiAgICAgIGxhYmVsLAogICAgICBjaGVja2VkLAogICAgICBkaXNhYmxlZCwKICAgICAgdG9nZ2xlQ2hlY2tlZCwKICAgICAgdG9nZ2xlRGlzYWJsZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxwIDpzdHlsZT0ieyBtYXJnaW5Cb3R0b206ICcyMHB4JyB9Ij4KICAgIDxhLWNoZWNrYm94IHYtbW9kZWw6Y2hlY2tlZD0iY2hlY2tlZCIgOmRpc2FibGVkPSJkaXNhYmxlZCI+CiAgICAgIHt7IGxhYmVsIH19CiAgICA8L2EtY2hlY2tib3g+CiAgPC9wPgogIDxwPgogICAgPGEtYnV0dG9uIHR5cGU9InByaW1hcnkiIHNpemU9InNtYWxsIiBAY2xpY2s9InRvZ2dsZUNoZWNrZWQiPgogICAgICB7eyAhY2hlY2tlZCA/ICdDaGVjaycgOiAnVW5jaGVjaycgfX0KICAgIDwvYS1idXR0b24+CiAgICA8YS1idXR0b24gOnN0eWxlPSJ7IG1hcmdpbkxlZnQ6ICcxMHB4JyB9IiB0eXBlPSJwcmltYXJ5IiBzaXplPSJzbWFsbCIgQGNsaWNrPSJ0b2dnbGVEaXNhYmxlIj4KICAgICAge3sgIWRpc2FibGVkID8gJ0Rpc2FibGUnIDogJ0VuYWJsZScgfX0KICAgIDwvYS1idXR0b24+CiAgPC9wPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBjb21wdXRlZCwgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgY2hlY2tlZCA9IHJlZihmYWxzZSk7CiAgICBjb25zdCBkaXNhYmxlZCA9IHJlZihmYWxzZSk7CiAgICBjb25zdCB0b2dnbGVDaGVja2VkID0gKCkgPT4gewogICAgICBjaGVja2VkLnZhbHVlID0gIWNoZWNrZWQudmFsdWU7CiAgICB9OwogICAgY29uc3QgdG9nZ2xlRGlzYWJsZSA9ICgpID0+IHsKICAgICAgZGlzYWJsZWQudmFsdWUgPSAhZGlzYWJsZWQudmFsdWU7CiAgICB9OwogICAgY29uc3QgbGFiZWwgPSBjb21wdXRlZCgoKSA9PiB7CiAgICAgIHJldHVybiBgJHtjaGVja2VkLnZhbHVlID8gJ0NoZWNrZWQnIDogJ1VuY2hlY2tlZCd9LSR7ZGlzYWJsZWQudmFsdWUgPyAnRGlzYWJsZWQnIDogJ0VuYWJsZWQnfWA7CiAgICB9KTsKICAgIHJldHVybiB7CiAgICAgIGxhYmVsLAogICAgICBjaGVja2VkLAogICAgICBkaXNhYmxlZCwKICAgICAgdG9nZ2xlQ2hlY2tlZCwKICAgICAgdG9nZ2xlRGlzYWJsZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[n("p",F,[e(l,{checked:s.checked,"onUpdate:checked":t[0]||(t[0]=b=>s.checked=b),disabled:s.disabled},{default:o(()=>[a(Z(s.label),1)]),_:1},8,["checked","disabled"])]),n("p",null,[e(u,{type:"primary",size:"small",onClick:s.toggleChecked},{default:o(()=>[a(Z(s.checked?"Uncheck":"Check"),1)]),_:1},8,["onClick"]),e(u,{style:{marginLeft:"10px"},type:"primary",size:"small",onClick:s.toggleDisable},{default:o(()=>[a(Z(s.disabled?"Enable":"Disable"),1)]),_:1},8,["onClick"])])]),htmlCode:o(()=>t[1]||(t[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("p")]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ marginBottom: '20px' }"),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-checkbox")]),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("checked"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":disabled"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("disabled"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      {{ label }}
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("primary"),n("span",{class:"token punctuation"},'"')]),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 attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("toggleChecked"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      {{ !checked ? 'Check' : 'Uncheck' }}
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ marginLeft: '10px' }"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("primary"),n("span",{class:"token punctuation"},'"')]),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 attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("toggleDisable"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      {{ !disabled ? 'Disable' : 'Enable' }}
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),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(" computed"),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(" checked "),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(" disabled "),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"},"toggleChecked"),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(`
      checked`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"!"),a("checked"),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"},"const"),a(),n("span",{class:"token function-variable function"},"toggleDisable"),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(`
      disabled`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"!"),a("disabled"),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"},"const"),a(" label "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("checked"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token string"},"'Checked'"),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Unchecked'"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"},"-"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a(`
        disabled`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token string"},"'Disabled'"),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Enabled'"),a(`
      `),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),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(`
      label`),n("span",{class:"token punctuation"},","),a(`
      checked`),n("span",{class:"token punctuation"},","),a(`
      disabled`),n("span",{class:"token punctuation"},","),a(`
      toggleChecked`),n("span",{class:"token punctuation"},","),a(`
      toggleDisable`),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:o(()=>t[2]||(t[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("p")]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ marginBottom: '20px' }"),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-checkbox")]),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("checked"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":disabled"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("disabled"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      {{ label }}
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("primary"),n("span",{class:"token punctuation"},'"')]),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 attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("toggleChecked"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      {{ !checked ? 'Check' : 'Uncheck' }}
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ marginLeft: '10px' }"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("primary"),n("span",{class:"token punctuation"},'"')]),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 attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("toggleDisable"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      {{ !disabled ? 'Disable' : 'Enable' }}
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),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(" computed"),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(" checked "),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(" disabled "),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"},"toggleChecked"),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(`
      checked`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"!"),a("checked"),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"},"const"),a(),n("span",{class:"token function-variable function"},"toggleDisable"),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(`
      disabled`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"!"),a("disabled"),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"},"const"),a(" label "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("checked"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token string"},"'Checked'"),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Unchecked'"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"},"-"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("disabled"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token string"},"'Disabled'"),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Enabled'"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),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(`
      label`),n("span",{class:"token punctuation"},","),a(`
      checked`),n("span",{class:"token punctuation"},","),a(`
      disabled`),n("span",{class:"token punctuation"},","),a(`
      toggleChecked`),n("span",{class:"token punctuation"},","),a(`
      toggleDisable`),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 j=d(J,[["render",L]]),X=I({setup(){return{checked1:A(!1),checked2:A(!0)}}});function R(s,t,k,i,r,h){const l=c("a-checkbox"),u=c("demo-box");return g(),m(u,{jsfiddle:{us:"Disabled checkbox",cn:"checkbox \u4E0D\u53EF\u7528",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>checkbox \u4E0D\u53EF\u7528</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Disabled checkbox</p>
`,order:3,title:{"zh-CN":"\u4E0D\u53EF\u7528","en-US":"Disabled"},relativePath:"components/checkbox/demo/disabled.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWNoZWNrYm94IHYtbW9kZWw6Y2hlY2tlZD0iY2hlY2tlZDEiIGRpc2FibGVkIC8+CiAgPGJyIC8+CiAgPGEtY2hlY2tib3ggdi1tb2RlbDpjaGVja2VkPSJjaGVja2VkMiIgZGlzYWJsZWQgLz4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIGNoZWNrZWQxOiByZWYoZmFsc2UpLAogICAgICBjaGVja2VkMjogcmVmKHRydWUpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWNoZWNrYm94IHYtbW9kZWw6Y2hlY2tlZD0iY2hlY2tlZDEiIGRpc2FibGVkIC8+CiAgPGJyIC8+CiAgPGEtY2hlY2tib3ggdi1tb2RlbDpjaGVja2VkPSJjaGVja2VkMiIgZGlzYWJsZWQgLz4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgcmV0dXJuIHsKICAgICAgY2hlY2tlZDE6IHJlZihmYWxzZSksCiAgICAgIGNoZWNrZWQyOiByZWYodHJ1ZSksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[e(l,{checked:s.checked1,"onUpdate:checked":t[0]||(t[0]=p=>s.checked1=p),disabled:""},null,8,["checked"]),t[2]||(t[2]=n("br",null,null,-1)),e(l,{checked:s.checked2,"onUpdate:checked":t[1]||(t[1]=p=>s.checked2=p),disabled:""},null,8,["checked"])]),htmlCode:o(()=>t[3]||(t[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-checkbox")]),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("checked1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"disabled"),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox")]),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("checked2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"disabled"),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(" 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"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"checked1"),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 literal-property property"},"checked2"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"true"),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"},","),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:o(()=>t[4]||(t[4]=[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-checkbox")]),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("checked1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"disabled"),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox")]),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("checked2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"disabled"),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(" 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"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"checked1"),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 literal-property property"},"checked2"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"true"),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"},","),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 K=d(X,[["render",R]]),z=["Apple","Pear","Orange"],U=[{label:"Apple",value:"Apple"},{label:"Pear",value:"Pear"},{label:"Orange",value:"Orange"}],q=[{value:"Apple"},{label:"Pear",value:"Pear"},{label:"Orange",value:"Orange",disabled:!1}],E=I({setup(){const s=W({value1:[],value2:["Apple"],value3:["Pear"],value4:["Apple"]});return{plainOptions:z,options:U,optionsWithDisabled:q,...f(s)}}}),Q={style:{color:"red"}};function O(s,t,k,i,r,h){const l=c("a-checkbox-group"),u=c("demo-box");return g(),m(u,{jsfiddle:{us:"Generate a group of checkboxes from an array",cn:"\u65B9\u4FBF\u7684\u4ECE\u6570\u7EC4\u751F\u6210 checkbox",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u65B9\u4FBF\u7684\u4ECE\u6570\u7EC4\u751F\u6210 checkbox</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Generate a group of checkboxes from an array</p>
`,order:4,title:{"zh-CN":"Checkbox \u7EC4","en-US":"Checkbox group"},relativePath:"components/checkbox/demo/group.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWNoZWNrYm94LWdyb3VwIHYtbW9kZWw6dmFsdWU9InZhbHVlMSIgbmFtZT0iY2hlY2tib3hncm91cCIgOm9wdGlvbnM9InBsYWluT3B0aW9ucyIgLz4KICA8YnIgLz4KICA8YnIgLz4KICA8YS1jaGVja2JveC1ncm91cCB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTIiIDpvcHRpb25zPSJwbGFpbk9wdGlvbnMiIC8+CiAgPGJyIC8+CiAgPGJyIC8+CiAgPGEtY2hlY2tib3gtZ3JvdXAgdi1tb2RlbDp2YWx1ZT0idmFsdWUzIiA6b3B0aW9ucz0ib3B0aW9ucyIgLz4KICA8YnIgLz4KICA8YnIgLz4KICA8YS1jaGVja2JveC1ncm91cCB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTQiIDpvcHRpb25zPSJvcHRpb25zV2l0aERpc2FibGVkIiBkaXNhYmxlZD4KICAgIDx0ZW1wbGF0ZSAjbGFiZWw9InsgdmFsdWUgfSI+CiAgICAgIDxzcGFuIHN0eWxlPSJjb2xvcjogcmVkIj57eyB2YWx1ZSB9fTwvc3Bhbj4KICAgIDwvdGVtcGxhdGU+CiAgPC9hLWNoZWNrYm94LWdyb3VwPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWFjdGl2ZSwgdG9SZWZzIH0gZnJvbSAndnVlJzsKCmNvbnN0IHBsYWluT3B0aW9ucyA9IFsnQXBwbGUnLCAnUGVhcicsICdPcmFuZ2UnXTsKY29uc3Qgb3B0aW9ucyA9IFsKICB7IGxhYmVsOiAnQXBwbGUnLCB2YWx1ZTogJ0FwcGxlJyB9LAogIHsgbGFiZWw6ICdQZWFyJywgdmFsdWU6ICdQZWFyJyB9LAogIHsgbGFiZWw6ICdPcmFuZ2UnLCB2YWx1ZTogJ09yYW5nZScgfSwKXTsKY29uc3Qgb3B0aW9uc1dpdGhEaXNhYmxlZCA9IFsKICB7IHZhbHVlOiAnQXBwbGUnIH0sCiAgeyBsYWJlbDogJ1BlYXInLCB2YWx1ZTogJ1BlYXInIH0sCiAgeyBsYWJlbDogJ09yYW5nZScsIHZhbHVlOiAnT3JhbmdlJywgZGlzYWJsZWQ6IGZhbHNlIH0sCl07CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBzdGF0ZSA9IHJlYWN0aXZlKHsKICAgICAgdmFsdWUxOiBbXSwKICAgICAgdmFsdWUyOiBbJ0FwcGxlJ10sCiAgICAgIHZhbHVlMzogWydQZWFyJ10sCiAgICAgIHZhbHVlNDogWydBcHBsZSddLAogICAgfSk7CiAgICByZXR1cm4gewogICAgICBwbGFpbk9wdGlvbnMsCiAgICAgIG9wdGlvbnMsCiAgICAgIG9wdGlvbnNXaXRoRGlzYWJsZWQsCiAgICAgIC4uLnRvUmVmcyhzdGF0ZSksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWNoZWNrYm94LWdyb3VwIHYtbW9kZWw6dmFsdWU9InZhbHVlMSIgbmFtZT0iY2hlY2tib3hncm91cCIgOm9wdGlvbnM9InBsYWluT3B0aW9ucyIgLz4KICA8YnIgLz4KICA8YnIgLz4KICA8YS1jaGVja2JveC1ncm91cCB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTIiIDpvcHRpb25zPSJwbGFpbk9wdGlvbnMiIC8+CiAgPGJyIC8+CiAgPGJyIC8+CiAgPGEtY2hlY2tib3gtZ3JvdXAgdi1tb2RlbDp2YWx1ZT0idmFsdWUzIiA6b3B0aW9ucz0ib3B0aW9ucyIgLz4KICA8YnIgLz4KICA8YnIgLz4KICA8YS1jaGVja2JveC1ncm91cCB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTQiIDpvcHRpb25zPSJvcHRpb25zV2l0aERpc2FibGVkIiBkaXNhYmxlZD4KICAgIDx0ZW1wbGF0ZSAjbGFiZWw9InsgdmFsdWUgfSI+CiAgICAgIDxzcGFuIHN0eWxlPSJjb2xvcjogcmVkIj57eyB2YWx1ZSB9fTwvc3Bhbj4KICAgIDwvdGVtcGxhdGU+CiAgPC9hLWNoZWNrYm94LWdyb3VwPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlYWN0aXZlLCB0b1JlZnMgfSBmcm9tICd2dWUnOwpjb25zdCBwbGFpbk9wdGlvbnMgPSBbJ0FwcGxlJywgJ1BlYXInLCAnT3JhbmdlJ107CmNvbnN0IG9wdGlvbnMgPSBbewogIGxhYmVsOiAnQXBwbGUnLAogIHZhbHVlOiAnQXBwbGUnLAp9LCB7CiAgbGFiZWw6ICdQZWFyJywKICB2YWx1ZTogJ1BlYXInLAp9LCB7CiAgbGFiZWw6ICdPcmFuZ2UnLAogIHZhbHVlOiAnT3JhbmdlJywKfV07CmNvbnN0IG9wdGlvbnNXaXRoRGlzYWJsZWQgPSBbewogIHZhbHVlOiAnQXBwbGUnLAp9LCB7CiAgbGFiZWw6ICdQZWFyJywKICB2YWx1ZTogJ1BlYXInLAp9LCB7CiAgbGFiZWw6ICdPcmFuZ2UnLAogIHZhbHVlOiAnT3JhbmdlJywKICBkaXNhYmxlZDogZmFsc2UsCn1dOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgc3RhdGUgPSByZWFjdGl2ZSh7CiAgICAgIHZhbHVlMTogW10sCiAgICAgIHZhbHVlMjogWydBcHBsZSddLAogICAgICB2YWx1ZTM6IFsnUGVhciddLAogICAgICB2YWx1ZTQ6IFsnQXBwbGUnXSwKICAgIH0pOwogICAgcmV0dXJuIHsKICAgICAgcGxhaW5PcHRpb25zLAogICAgICBvcHRpb25zLAogICAgICBvcHRpb25zV2l0aERpc2FibGVkLAogICAgICAuLi50b1JlZnMoc3RhdGUpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[e(l,{value:s.value1,"onUpdate:value":t[0]||(t[0]=p=>s.value1=p),name:"checkboxgroup",options:s.plainOptions},null,8,["value","options"]),t[4]||(t[4]=n("br",null,null,-1)),t[5]||(t[5]=n("br",null,null,-1)),e(l,{value:s.value2,"onUpdate:value":t[1]||(t[1]=p=>s.value2=p),options:s.plainOptions},null,8,["value","options"]),t[6]||(t[6]=n("br",null,null,-1)),t[7]||(t[7]=n("br",null,null,-1)),e(l,{value:s.value3,"onUpdate:value":t[2]||(t[2]=p=>s.value3=p),options:s.options},null,8,["value","options"]),t[8]||(t[8]=n("br",null,null,-1)),t[9]||(t[9]=n("br",null,null,-1)),e(l,{value:s.value4,"onUpdate:value":t[3]||(t[3]=p=>s.value4=p),options:s.optionsWithDisabled,disabled:""},{label:o(({value:p})=>[n("span",Q,Z(p),1)]),_:1},8,["value","options"])]),htmlCode:o(()=>t[10]||(t[10]=[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-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"name"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("checkboxgroup"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("plainOptions"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("plainOptions"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("options"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value4"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("optionsWithDisabled"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"disabled"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ value }"),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("span")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"color"),n("span",{class:"token punctuation"},":"),a(" red")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a("{{ value }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("span")]),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("a-checkbox-group")]),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(" reactive"),n("span",{class:"token punctuation"},","),a(" toRefs "),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"},"const"),a(" plainOptions "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'Orange'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"const"),a(" options "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),a(`
  `),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Apple'"),a(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Pear'"),a(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Orange'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Orange'"),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 keyword"},"const"),a(" optionsWithDisabled "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),a(`
  `),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Apple'"),a(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Pear'"),a(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Orange'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Orange'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"false"),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 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(" state "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"value1"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"value2"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"value3"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"value4"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apple'"),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 keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      plainOptions`),n("span",{class:"token punctuation"},","),a(`
      options`),n("span",{class:"token punctuation"},","),a(`
      optionsWithDisabled`),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"toRefs"),n("span",{class:"token punctuation"},"("),a("state"),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"},","),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:o(()=>t[11]||(t[11]=[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-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"name"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("checkboxgroup"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("plainOptions"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("plainOptions"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("options"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value4"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":options"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("optionsWithDisabled"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"disabled"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ value }"),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("span")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"color"),n("span",{class:"token punctuation"},":"),a(" red")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a("{{ value }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("span")]),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("a-checkbox-group")]),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(" reactive"),n("span",{class:"token punctuation"},","),a(" toRefs "),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"},"const"),a(" plainOptions "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'Orange'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"const"),a(" options "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Orange'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Orange'"),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"},"const"),a(" optionsWithDisabled "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Orange'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Orange'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token literal-property property"},"disabled"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"false"),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"},"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(" state "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"value1"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"value2"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apple'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"value3"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Pear'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"value4"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'Apple'"),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 keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      plainOptions`),n("span",{class:"token punctuation"},","),a(`
      options`),n("span",{class:"token punctuation"},","),a(`
      optionsWithDisabled`),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token operator"},"..."),n("span",{class:"token function"},"toRefs"),n("span",{class:"token punctuation"},"("),a("state"),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"},","),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 T=d(E,[["render",O]]),_=I({setup(){return{value:A([])}}});function $(s,t,k,i,r,h){const l=c("a-checkbox"),u=c("a-col"),p=c("a-row"),b=c("a-checkbox-group"),C=c("demo-box");return g(),m(C,{jsfiddle:{us:"We can use Checkbox and Grid Checkbox.group, to implement complex layout",cn:"Checkbox.Group \u5185\u5D4C Checkbox \u5E76\u4E0E Grid \u7EC4\u4EF6\u4E00\u8D77\u4F7F\u7528\uFF0C\u53EF\u4EE5\u5B9E\u73B0\u7075\u6D3B\u7684\u5E03\u5C40",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Checkbox.Group \u5185\u5D4C Checkbox \u5E76\u4E0E Grid \u7EC4\u4EF6\u4E00\u8D77\u4F7F\u7528\uFF0C\u53EF\u4EE5\u5B9E\u73B0\u7075\u6D3B\u7684\u5E03\u5C40</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>We can use Checkbox and Grid Checkbox.group, to implement complex layout</p>
`,order:5,title:{"zh-CN":"\u5E03\u5C40","en-US":"Use with grid"},relativePath:"components/checkbox/demo/layout.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWNoZWNrYm94LWdyb3VwIHYtbW9kZWw6dmFsdWU9InZhbHVlIiBzdHlsZT0id2lkdGg6IDEwMCUiPgogICAgPGEtcm93PgogICAgICA8YS1jb2wgOnNwYW49IjgiPgogICAgICAgIDxhLWNoZWNrYm94IHZhbHVlPSJBIj5BPC9hLWNoZWNrYm94PgogICAgICA8L2EtY29sPgogICAgICA8YS1jb2wgOnNwYW49IjgiPgogICAgICAgIDxhLWNoZWNrYm94IHZhbHVlPSJCIj5CPC9hLWNoZWNrYm94PgogICAgICA8L2EtY29sPgogICAgICA8YS1jb2wgOnNwYW49IjgiPgogICAgICAgIDxhLWNoZWNrYm94IHZhbHVlPSJDIj5DPC9hLWNoZWNrYm94PgogICAgICA8L2EtY29sPgogICAgICA8YS1jb2wgOnNwYW49IjgiPgogICAgICAgIDxhLWNoZWNrYm94IHZhbHVlPSJEIj5EPC9hLWNoZWNrYm94PgogICAgICA8L2EtY29sPgogICAgICA8YS1jb2wgOnNwYW49IjgiPgogICAgICAgIDxhLWNoZWNrYm94IHZhbHVlPSJFIj5FPC9hLWNoZWNrYm94PgogICAgICA8L2EtY29sPgogICAgPC9hLXJvdz4KICA8L2EtY2hlY2tib3gtZ3JvdXA+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZSA9IHJlZihbXSk7CiAgICByZXR1cm4gewogICAgICB2YWx1ZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWNoZWNrYm94LWdyb3VwIHYtbW9kZWw6dmFsdWU9InZhbHVlIiBzdHlsZT0id2lkdGg6IDEwMCUiPgogICAgPGEtcm93PgogICAgICA8YS1jb2wgOnNwYW49IjgiPgogICAgICAgIDxhLWNoZWNrYm94IHZhbHVlPSJBIj5BPC9hLWNoZWNrYm94PgogICAgICA8L2EtY29sPgogICAgICA8YS1jb2wgOnNwYW49IjgiPgogICAgICAgIDxhLWNoZWNrYm94IHZhbHVlPSJCIj5CPC9hLWNoZWNrYm94PgogICAgICA8L2EtY29sPgogICAgICA8YS1jb2wgOnNwYW49IjgiPgogICAgICAgIDxhLWNoZWNrYm94IHZhbHVlPSJDIj5DPC9hLWNoZWNrYm94PgogICAgICA8L2EtY29sPgogICAgICA8YS1jb2wgOnNwYW49IjgiPgogICAgICAgIDxhLWNoZWNrYm94IHZhbHVlPSJEIj5EPC9hLWNoZWNrYm94PgogICAgICA8L2EtY29sPgogICAgICA8YS1jb2wgOnNwYW49IjgiPgogICAgICAgIDxhLWNoZWNrYm94IHZhbHVlPSJFIj5FPC9hLWNoZWNrYm94PgogICAgICA8L2EtY29sPgogICAgPC9hLXJvdz4KICA8L2EtY2hlY2tib3gtZ3JvdXA+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHZhbHVlID0gcmVmKFtdKTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[e(b,{value:s.value,"onUpdate:value":t[0]||(t[0]=y=>s.value=y),style:{width:"100%"}},{default:o(()=>[e(p,null,{default:o(()=>[e(u,{span:8},{default:o(()=>[e(l,{value:"A"},{default:o(()=>t[1]||(t[1]=[a("A")])),_:1,__:[1]})]),_:1}),e(u,{span:8},{default:o(()=>[e(l,{value:"B"},{default:o(()=>t[2]||(t[2]=[a("B")])),_:1,__:[2]})]),_:1}),e(u,{span:8},{default:o(()=>[e(l,{value:"C"},{default:o(()=>t[3]||(t[3]=[a("C")])),_:1,__:[3]})]),_:1}),e(u,{span:8},{default:o(()=>[e(l,{value:"D"},{default:o(()=>t[4]||(t[4]=[a("D")])),_:1,__:[4]})]),_:1}),e(u,{span:8},{default:o(()=>[e(l,{value:"E"},{default:o(()=>t[5]||(t[5]=[a("E")])),_:1,__:[5]})]),_:1})]),_:1})]),_:1},8,["value"])]),htmlCode:o(()=>t[6]||(t[6]=[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-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 100%")]),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-row")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("8"),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-checkbox")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("A"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("A"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("8"),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-checkbox")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("B"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("B"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("8"),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-checkbox")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("C"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("C"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("8"),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-checkbox")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("D"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("D"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("8"),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-checkbox")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("E"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("E"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-row")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox-group")]),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(" value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),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(`
      value`),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:o(()=>t[7]||(t[7]=[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-checkbox-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 100%")]),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-row")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("8"),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-checkbox")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("A"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("A"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("8"),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-checkbox")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("B"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("B"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("8"),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-checkbox")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("C"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("C"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("8"),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-checkbox")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("D"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("D"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("8"),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-checkbox")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("E"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("E"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-row")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-checkbox-group")]),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(" value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),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(`
      value`),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 M=d(_,[["render",$]]),nn={pageData:{title:"Checkbox",description:"",frontmatter:{category:"Components",subtitle:"\u591A\u9009\u6846",type:"\u6570\u636E\u5F55\u5165",title:"Checkbox",cover:"https://gw.alipayobjects.com/zos/alicdn/8nbVbHEm_/CheckBox.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:""},{level:2,title:"API",slug:"API",content:"\u5C5E\u6027"},{level:3,title:"\u5C5E\u6027",slug:"\u5C5E\u6027",content:"Checkbox"},{level:3,title:"\u65B9\u6CD5",slug:"\u65B9\u6CD5",content:"Checkbox"}],relativePath:"components/checkbox/index.zh-CN.md",content:`
\u591A\u9009\u6846\u3002

## \u4F55\u65F6\u4F7F\u7528

- \u5728\u4E00\u7EC4\u53EF\u9009\u9879\u4E2D\u8FDB\u884C\u591A\u9879\u9009\u62E9\u65F6\uFF1B
- \u5355\u72EC\u4F7F\u7528\u53EF\u4EE5\u8868\u793A\u4E24\u79CD\u72B6\u6001\u4E4B\u95F4\u7684\u5207\u6362\uFF0C\u548C \`switch\` \u7C7B\u4F3C\u3002\u533A\u522B\u5728\u4E8E\u5207\u6362 \`switch\` \u4F1A\u76F4\u63A5\u89E6\u53D1\u72B6\u6001\u6539\u53D8\uFF0C\u800C \`checkbox\` \u4E00\u822C\u7528\u4E8E\u72B6\u6001\u6807\u8BB0\uFF0C\u9700\u8981\u548C\u63D0\u4EA4\u64CD\u4F5C\u914D\u5408\u3002

## API

### \u5C5E\u6027

#### Checkbox

| \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
| --- | --- | --- | --- | --- |
| autofocus | \u81EA\u52A8\u83B7\u53D6\u7126\u70B9 | boolean | false |  |
| checked(v-model) | \u6307\u5B9A\u5F53\u524D\u662F\u5426\u9009\u4E2D | boolean | false |  |
| disabled | \u5931\u6548\u72B6\u6001 | boolean | false |  |
| indeterminate | \u8BBE\u7F6E indeterminate \u72B6\u6001\uFF0C\u53EA\u8D1F\u8D23\u6837\u5F0F\u63A7\u5236 | boolean | false |  |
| value | \u4E0E CheckboxGroup \u7EC4\u5408\u4F7F\u7528\u65F6\u7684\u503C | boolean \\| string \\| number | - |  |

#### \u4E8B\u4EF6

| \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E           | \u56DE\u8C03\u53C2\u6570          | \u7248\u672C |     |
| -------- | -------------- | ----------------- | ---- | --- |
| change   | \u53D8\u5316\u65F6\u56DE\u8C03\u51FD\u6570 | Function(e:Event) | -    |     |

#### Checkbox Group

| \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
| --- | --- | --- | --- | --- |
| disabled | \u6574\u7EC4\u5931\u6548 | boolean | false |  |
| name | CheckboxGroup \u4E0B\u6240\u6709 \`input[type=&quot;checkbox&quot;]\` \u7684 \`name\` \u5C5E\u6027 | string | - | 1.5.0 |
| options | \u6307\u5B9A\u53EF\u9009\u9879\uFF0C\u53EF\u4EE5\u901A\u8FC7 slot=&quot;label&quot; slot-scope=&quot;option&quot; \u5B9A\u5236\`label\` | string\\[] \\| Array&amp;lt;{ label: string value: string disabled?: boolean, indeterminate?: boolean, onChange?: function }&gt; | \\[] |  |
| value(v-model) | \u6307\u5B9A\u9009\u4E2D\u7684\u9009\u9879 | string\\[] | \\[] |  |

#### \u4E8B\u4EF6

| \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E           | \u56DE\u8C03\u53C2\u6570               | \u7248\u672C |     |
| -------- | -------------- | ---------------------- | ---- | --- |
| change   | \u53D8\u5316\u65F6\u56DE\u8C03\u51FD\u6570 | Function(checkedValue) | -    |     |

### \u65B9\u6CD5

#### Checkbox

| \u540D\u79F0    | \u63CF\u8FF0     | \u7248\u672C |
| ------- | -------- | ---- |
| blur()  | \u79FB\u9664\u7126\u70B9 |      |
| focus() | \u83B7\u53D6\u7126\u70B9 |      |
`,html:`<p>\u591A\u9009\u6846\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>
<ul>
<li>\u5728\u4E00\u7EC4\u53EF\u9009\u9879\u4E2D\u8FDB\u884C\u591A\u9879\u9009\u62E9\u65F6\uFF1B</li>
<li>\u5355\u72EC\u4F7F\u7528\u53EF\u4EE5\u8868\u793A\u4E24\u79CD\u72B6\u6001\u4E4B\u95F4\u7684\u5207\u6362\uFF0C\u548C <code>switch</code> \u7C7B\u4F3C\u3002\u533A\u522B\u5728\u4E8E\u5207\u6362 <code>switch</code> \u4F1A\u76F4\u63A5\u89E6\u53D1\u72B6\u6001\u6539\u53D8\uFF0C\u800C <code>checkbox</code> \u4E00\u822C\u7528\u4E8E\u72B6\u6001\u6807\u8BB0\uFF0C\u9700\u8981\u548C\u63D0\u4EA4\u64CD\u4F5C\u914D\u5408\u3002</li>
</ul>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<h3 id="\u5C5E\u6027">\u5C5E\u6027 <a class="header-anchor" href="#\u5C5E\u6027">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<h4 id="Checkbox">Checkbox <a class="header-anchor" href="#Checkbox">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h4>
<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>autofocus</td>
<td>\u81EA\u52A8\u83B7\u53D6\u7126\u70B9</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>checked(v-model)</td>
<td>\u6307\u5B9A\u5F53\u524D\u662F\u5426\u9009\u4E2D</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>disabled</td>
<td>\u5931\u6548\u72B6\u6001</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>indeterminate</td>
<td>\u8BBE\u7F6E indeterminate \u72B6\u6001\uFF0C\u53EA\u8D1F\u8D23\u6837\u5F0F\u63A7\u5236</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>value</td>
<td>\u4E0E CheckboxGroup \u7EC4\u5408\u4F7F\u7528\u65F6\u7684\u503C</td>
<td>boolean | string | number</td>
<td>-</td>
<td></td>
</tr>
</tbody>
</table>
<h4 id="\u4E8B\u4EF6">\u4E8B\u4EF6 <a class="header-anchor" href="#\u4E8B\u4EF6">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h4>
<table>
<thead>
<tr>
<th>\u4E8B\u4EF6\u540D\u79F0</th>
<th>\u8BF4\u660E</th>
<th>\u56DE\u8C03\u53C2\u6570</th>
<th>\u7248\u672C</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>change</td>
<td>\u53D8\u5316\u65F6\u56DE\u8C03\u51FD\u6570</td>
<td>Function(e:Event)</td>
<td>-</td>
<td></td>
</tr>
</tbody>
</table>
<h4 id="Checkbox-Group">Checkbox Group <a class="header-anchor" href="#Checkbox-Group">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h4>
<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>disabled</td>
<td>\u6574\u7EC4\u5931\u6548</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>name</td>
<td>CheckboxGroup \u4E0B\u6240\u6709 <code>input[type=&quot;checkbox&quot;]</code> \u7684 <code>name</code> \u5C5E\u6027</td>
<td>string</td>
<td>-</td>
<td>1.5.0</td>
</tr>
<tr>
<td>options</td>
<td>\u6307\u5B9A\u53EF\u9009\u9879\uFF0C\u53EF\u4EE5\u901A\u8FC7 slot=&quot;label&quot; slot-scope=&quot;option&quot; \u5B9A\u5236<code>label</code></td>
<td>string[] | Array&lt;{ label: string value: string disabled?: boolean, indeterminate?: boolean, onChange?: function }&gt;</td>
<td>[]</td>
<td></td>
</tr>
<tr>
<td>value(v-model)</td>
<td>\u6307\u5B9A\u9009\u4E2D\u7684\u9009\u9879</td>
<td>string[]</td>
<td>[]</td>
<td></td>
</tr>
</tbody>
</table>
<h4 id="\u4E8B\u4EF6-1">\u4E8B\u4EF6 <a class="header-anchor" href="#\u4E8B\u4EF6-1">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h4>
<table>
<thead>
<tr>
<th>\u4E8B\u4EF6\u540D\u79F0</th>
<th>\u8BF4\u660E</th>
<th>\u56DE\u8C03\u53C2\u6570</th>
<th>\u7248\u672C</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>change</td>
<td>\u53D8\u5316\u65F6\u56DE\u8C03\u51FD\u6570</td>
<td>Function(checkedValue)</td>
<td>-</td>
<td></td>
</tr>
</tbody>
</table>
<h3 id="\u65B9\u6CD5">\u65B9\u6CD5 <a class="header-anchor" href="#\u65B9\u6CD5">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<h4 id="Checkbox-1">Checkbox <a class="header-anchor" href="#Checkbox-1">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h4>
<table>
<thead>
<tr>
<th>\u540D\u79F0</th>
<th>\u63CF\u8FF0</th>
<th>\u7248\u672C</th>
</tr>
</thead>
<tbody>
<tr>
<td>blur()</td>
<td>\u79FB\u9664\u7126\u70B9</td>
<td></td>
</tr>
<tr>
<td>focus()</td>
<td>\u83B7\u53D6\u7126\u70B9</td>
<td></td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060300638}},an={class:"markdown"};function tn(s,t,k,i,r,h){return g(),w("article",an,t[0]||(t[0]=[x('<p>\u591A\u9009\u6846\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><ul><li>\u5728\u4E00\u7EC4\u53EF\u9009\u9879\u4E2D\u8FDB\u884C\u591A\u9879\u9009\u62E9\u65F6\uFF1B</li><li>\u5355\u72EC\u4F7F\u7528\u53EF\u4EE5\u8868\u793A\u4E24\u79CD\u72B6\u6001\u4E4B\u95F4\u7684\u5207\u6362\uFF0C\u548C <code>switch</code> \u7C7B\u4F3C\u3002\u533A\u522B\u5728\u4E8E\u5207\u6362 <code>switch</code> \u4F1A\u76F4\u63A5\u89E6\u53D1\u72B6\u6001\u6539\u53D8\uFF0C\u800C <code>checkbox</code> \u4E00\u822C\u7528\u4E8E\u72B6\u6001\u6807\u8BB0\uFF0C\u9700\u8981\u548C\u63D0\u4EA4\u64CD\u4F5C\u914D\u5408\u3002</li></ul><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><h3 id="\u5C5E\u6027">\u5C5E\u6027 <a class="header-anchor" href="#\u5C5E\u6027"><span aria-hidden="true" class="anchor">#</span></a></h3><h4 id="Checkbox">Checkbox <a class="header-anchor" href="#Checkbox"><span aria-hidden="true" class="anchor">#</span></a></h4><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>autofocus</td><td>\u81EA\u52A8\u83B7\u53D6\u7126\u70B9</td><td>boolean</td><td>false</td><td></td></tr><tr><td>checked(v-model)</td><td>\u6307\u5B9A\u5F53\u524D\u662F\u5426\u9009\u4E2D</td><td>boolean</td><td>false</td><td></td></tr><tr><td>disabled</td><td>\u5931\u6548\u72B6\u6001</td><td>boolean</td><td>false</td><td></td></tr><tr><td>indeterminate</td><td>\u8BBE\u7F6E indeterminate \u72B6\u6001\uFF0C\u53EA\u8D1F\u8D23\u6837\u5F0F\u63A7\u5236</td><td>boolean</td><td>false</td><td></td></tr><tr><td>value</td><td>\u4E0E CheckboxGroup \u7EC4\u5408\u4F7F\u7528\u65F6\u7684\u503C</td><td>boolean | string | number</td><td>-</td><td></td></tr></tbody></table><h4 id="\u4E8B\u4EF6">\u4E8B\u4EF6 <a class="header-anchor" href="#\u4E8B\u4EF6"><span aria-hidden="true" class="anchor">#</span></a></h4><table><thead><tr><th>\u4E8B\u4EF6\u540D\u79F0</th><th>\u8BF4\u660E</th><th>\u56DE\u8C03\u53C2\u6570</th><th>\u7248\u672C</th><th></th></tr></thead><tbody><tr><td>change</td><td>\u53D8\u5316\u65F6\u56DE\u8C03\u51FD\u6570</td><td>Function(e:Event)</td><td>-</td><td></td></tr></tbody></table><h4 id="Checkbox-Group">Checkbox Group <a class="header-anchor" href="#Checkbox-Group"><span aria-hidden="true" class="anchor">#</span></a></h4><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>disabled</td><td>\u6574\u7EC4\u5931\u6548</td><td>boolean</td><td>false</td><td></td></tr><tr><td>name</td><td>CheckboxGroup \u4E0B\u6240\u6709 <code>input[type=&quot;checkbox&quot;]</code> \u7684 <code>name</code> \u5C5E\u6027</td><td>string</td><td>-</td><td>1.5.0</td></tr><tr><td>options</td><td>\u6307\u5B9A\u53EF\u9009\u9879\uFF0C\u53EF\u4EE5\u901A\u8FC7 slot=&quot;label&quot; slot-scope=&quot;option&quot; \u5B9A\u5236<code>label</code></td><td>string[] | Array&lt;{ label: string value: string disabled?: boolean, indeterminate?: boolean, onChange?: function }&gt;</td><td>[]</td><td></td></tr><tr><td>value(v-model)</td><td>\u6307\u5B9A\u9009\u4E2D\u7684\u9009\u9879</td><td>string[]</td><td>[]</td><td></td></tr></tbody></table><h4 id="\u4E8B\u4EF6-1">\u4E8B\u4EF6 <a class="header-anchor" href="#\u4E8B\u4EF6-1"><span aria-hidden="true" class="anchor">#</span></a></h4><table><thead><tr><th>\u4E8B\u4EF6\u540D\u79F0</th><th>\u8BF4\u660E</th><th>\u56DE\u8C03\u53C2\u6570</th><th>\u7248\u672C</th><th></th></tr></thead><tbody><tr><td>change</td><td>\u53D8\u5316\u65F6\u56DE\u8C03\u51FD\u6570</td><td>Function(checkedValue)</td><td>-</td><td></td></tr></tbody></table><h3 id="\u65B9\u6CD5">\u65B9\u6CD5 <a class="header-anchor" href="#\u65B9\u6CD5"><span aria-hidden="true" class="anchor">#</span></a></h3><h4 id="Checkbox-1">Checkbox <a class="header-anchor" href="#Checkbox-1"><span aria-hidden="true" class="anchor">#</span></a></h4><table><thead><tr><th>\u540D\u79F0</th><th>\u63CF\u8FF0</th><th>\u7248\u672C</th></tr></thead><tbody><tr><td>blur()</td><td>\u79FB\u9664\u7126\u70B9</td><td></td></tr><tr><td>focus()</td><td>\u83B7\u53D6\u7126\u70B9</td><td></td></tr></tbody></table>',16)]))}const sn=d(nn,[["render",tn]]),on={pageData:{title:"Checkbox",description:"",frontmatter:{category:"Components",type:"Data Entry",title:"Checkbox",cover:"https://gw.alipayobjects.com/zos/alicdn/8nbVbHEm_/CheckBox.svg"},headers:[{level:2,title:"When To Use",slug:"When-To-Use",content:""},{level:2,title:"API",slug:"API",content:"Props"},{level:3,title:"Props",slug:"Props",content:"Checkbox"},{level:3,title:"Methods",slug:"Methods",content:"Checkbox"}],relativePath:"components/checkbox/index.en-US.md",content:`
Checkbox component.

## When To Use

- Used for selecting multiple values from several options.
- If you use only one checkbox, it is the same as using Switch to toggle between two states. The difference is that Switch will trigger the state change directly, but Checkbox just marks the state as changed and this needs to be submitted.

## API

### Props

#### Checkbox

| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| autofocus | get focus when component mounted | boolean | false |  |
| checked(v-model) | Specifies whether the checkbox is selected. | boolean | false |  |
| disabled | Disable checkbox | boolean | false |  |
| indeterminate | indeterminate checked state of checkbox | boolean | false |  |
| value | value of checkbox in CheckboxGroup | boolean \\| string \\| number | - |  |

#### events

| Events Name | Description | Arguments | Version |
| --- | --- | --- | --- |
| change | The callback function that is triggered when the state changes. | Function(e:Event) |  |

#### Checkbox Group

| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| disabled | Disable all checkboxes | boolean | false |  |
| name | The \`name\` property of all \`input[type=&quot;checkbox&quot;]\` children | string | - | 1.5.0 |
| options | Specifies options, you can customize \`label\` with slot = &quot;label&quot; slot-scope=&quot;option&quot; | string\\[] \\| Array&amp;lt;{ label: string value: string disabled?: boolean, indeterminate?: boolean, onChange?: function }&gt; | \\[] |  |
| value(v-model) | Used for setting the currently selected value. | string\\[] | \\[] |  |

#### events

| Events Name | Description | Arguments | Version |
| --- | --- | --- | --- |
| change | The callback function that is triggered when the state changes. | Function(checkedValue) |  |

### Methods

#### Checkbox

| Name    | Description  | Version |
| ------- | ------------ | ------- |
| blur()  | remove focus |         |
| focus() | get focus    |         |
`,html:`<p>Checkbox component.</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>
<ul>
<li>Used for selecting multiple values from several options.</li>
<li>If you use only one checkbox, it is the same as using Switch to toggle between two states. The difference is that Switch will trigger the state change directly, but Checkbox just marks the state as changed and this needs to be submitted.</li>
</ul>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<h3 id="Props">Props <a class="header-anchor" href="#Props">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<h4 id="Checkbox">Checkbox <a class="header-anchor" href="#Checkbox">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h4>
<table>
<thead>
<tr>
<th>Property</th>
<th>Description</th>
<th>Type</th>
<th>Default</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>autofocus</td>
<td>get focus when component mounted</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>checked(v-model)</td>
<td>Specifies whether the checkbox is selected.</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>disabled</td>
<td>Disable checkbox</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>indeterminate</td>
<td>indeterminate checked state of checkbox</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>value</td>
<td>value of checkbox in CheckboxGroup</td>
<td>boolean | string | number</td>
<td>-</td>
<td></td>
</tr>
</tbody>
</table>
<h4 id="events">events <a class="header-anchor" href="#events">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h4>
<table>
<thead>
<tr>
<th>Events Name</th>
<th>Description</th>
<th>Arguments</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>change</td>
<td>The callback function that is triggered when the state changes.</td>
<td>Function(e:Event)</td>
<td></td>
</tr>
</tbody>
</table>
<h4 id="Checkbox-Group">Checkbox Group <a class="header-anchor" href="#Checkbox-Group">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h4>
<table>
<thead>
<tr>
<th>Property</th>
<th>Description</th>
<th>Type</th>
<th>Default</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>disabled</td>
<td>Disable all checkboxes</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>name</td>
<td>The <code>name</code> property of all <code>input[type=&quot;checkbox&quot;]</code> children</td>
<td>string</td>
<td>-</td>
<td>1.5.0</td>
</tr>
<tr>
<td>options</td>
<td>Specifies options, you can customize <code>label</code> with slot = &quot;label&quot; slot-scope=&quot;option&quot;</td>
<td>string[] | Array&lt;{ label: string value: string disabled?: boolean, indeterminate?: boolean, onChange?: function }&gt;</td>
<td>[]</td>
<td></td>
</tr>
<tr>
<td>value(v-model)</td>
<td>Used for setting the currently selected value.</td>
<td>string[]</td>
<td>[]</td>
<td></td>
</tr>
</tbody>
</table>
<h4 id="events-1">events <a class="header-anchor" href="#events-1">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h4>
<table>
<thead>
<tr>
<th>Events Name</th>
<th>Description</th>
<th>Arguments</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>change</td>
<td>The callback function that is triggered when the state changes.</td>
<td>Function(checkedValue)</td>
<td></td>
</tr>
</tbody>
</table>
<h3 id="Methods">Methods <a class="header-anchor" href="#Methods">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<h4 id="Checkbox-1">Checkbox <a class="header-anchor" href="#Checkbox-1">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h4>
<table>
<thead>
<tr>
<th>Name</th>
<th>Description</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>blur()</td>
<td>remove focus</td>
<td></td>
</tr>
<tr>
<td>focus()</td>
<td>get focus</td>
<td></td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060300637}},en={class:"markdown"};function cn(s,t,k,i,r,h){return g(),w("article",en,t[0]||(t[0]=[x('<p>Checkbox component.</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><ul><li>Used for selecting multiple values from several options.</li><li>If you use only one checkbox, it is the same as using Switch to toggle between two states. The difference is that Switch will trigger the state change directly, but Checkbox just marks the state as changed and this needs to be submitted.</li></ul><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><h3 id="Props">Props <a class="header-anchor" href="#Props"><span aria-hidden="true" class="anchor">#</span></a></h3><h4 id="Checkbox">Checkbox <a class="header-anchor" href="#Checkbox"><span aria-hidden="true" class="anchor">#</span></a></h4><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th><th>Version</th></tr></thead><tbody><tr><td>autofocus</td><td>get focus when component mounted</td><td>boolean</td><td>false</td><td></td></tr><tr><td>checked(v-model)</td><td>Specifies whether the checkbox is selected.</td><td>boolean</td><td>false</td><td></td></tr><tr><td>disabled</td><td>Disable checkbox</td><td>boolean</td><td>false</td><td></td></tr><tr><td>indeterminate</td><td>indeterminate checked state of checkbox</td><td>boolean</td><td>false</td><td></td></tr><tr><td>value</td><td>value of checkbox in CheckboxGroup</td><td>boolean | string | number</td><td>-</td><td></td></tr></tbody></table><h4 id="events">events <a class="header-anchor" href="#events"><span aria-hidden="true" class="anchor">#</span></a></h4><table><thead><tr><th>Events Name</th><th>Description</th><th>Arguments</th><th>Version</th></tr></thead><tbody><tr><td>change</td><td>The callback function that is triggered when the state changes.</td><td>Function(e:Event)</td><td></td></tr></tbody></table><h4 id="Checkbox-Group">Checkbox Group <a class="header-anchor" href="#Checkbox-Group"><span aria-hidden="true" class="anchor">#</span></a></h4><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th><th>Version</th></tr></thead><tbody><tr><td>disabled</td><td>Disable all checkboxes</td><td>boolean</td><td>false</td><td></td></tr><tr><td>name</td><td>The <code>name</code> property of all <code>input[type=&quot;checkbox&quot;]</code> children</td><td>string</td><td>-</td><td>1.5.0</td></tr><tr><td>options</td><td>Specifies options, you can customize <code>label</code> with slot = &quot;label&quot; slot-scope=&quot;option&quot;</td><td>string[] | Array&lt;{ label: string value: string disabled?: boolean, indeterminate?: boolean, onChange?: function }&gt;</td><td>[]</td><td></td></tr><tr><td>value(v-model)</td><td>Used for setting the currently selected value.</td><td>string[]</td><td>[]</td><td></td></tr></tbody></table><h4 id="events-1">events <a class="header-anchor" href="#events-1"><span aria-hidden="true" class="anchor">#</span></a></h4><table><thead><tr><th>Events Name</th><th>Description</th><th>Arguments</th><th>Version</th></tr></thead><tbody><tr><td>change</td><td>The callback function that is triggered when the state changes.</td><td>Function(checkedValue)</td><td></td></tr></tbody></table><h3 id="Methods">Methods <a class="header-anchor" href="#Methods"><span aria-hidden="true" class="anchor">#</span></a></h3><h4 id="Checkbox-1">Checkbox <a class="header-anchor" href="#Checkbox-1"><span aria-hidden="true" class="anchor">#</span></a></h4><table><thead><tr><th>Name</th><th>Description</th><th>Version</th></tr></thead><tbody><tr><td>blur()</td><td>remove focus</td><td></td></tr><tr><td>focus()</td><td>get focus</td><td></td></tr></tbody></table>',16)]))}const pn=d(on,[["render",cn]]),ln=I({CN:sn,US:pn,components:{Basic:H,CheckAll:D,Controller:j,Disabled:K,Group:T,Layout:M},setup(){return{}}});function un(s,t,k,i,r,h){const l=c("basic"),u=c("check-all"),p=c("controller"),b=c("disabled"),C=c("group"),y=c("layout"),Y=c("demo-sort");return g(),m(Y,null,{default:o(()=>[e(l),e(u),e(p),e(b),e(C),e(y)]),_:1})}const rn=d(ln,[["render",un]]);export{rn as default};