import{aw as n,ag as s,y as i,z as l,A as e,P as a,b0 as b,L as d,H as o}from"./chunks/framework.BCBheFgR.js";const g=JSON.parse('{"title":"Checkbox 多选框","description":"","frontmatter":{},"headers":[],"relativePath":"form-config/fields/checkbox.md","filePath":"form-config/fields/checkbox.md"}'),h={name:"form-config/fields/checkbox.md"};function c(m,t,u,x,k,f){const r=s("demo-block");return l(),i("div",null,[t[3]||(t[3]=e("h1",{id:"checkbox-多选框",tabindex:"-1"},[d("Checkbox 多选框 "),e("a",{class:"header-anchor",href:"#checkbox-多选框","aria-label":'Permalink to "Checkbox 多选框"'},"​")],-1)),t[4]||(t[4]=e("p",null,"一组备选项中进行多选",-1)),t[5]||(t[5]=e("h2",{id:"基础用法",tabindex:"-1"},[d("基础用法 "),e("a",{class:"header-anchor",href:"#基础用法","aria-label":'Permalink to "基础用法"'},"​")],-1)),t[6]||(t[6]=e("p",null,"单独使用可以表示两种状态之间的切换。",-1)),a(r,{type:"form",config:[{type:"checkbox",name:"checkbox",text:"选项"}]},{source:o(()=>t[0]||(t[0]=[e("p",null," 要使用 Checkbox 组件，只需要配置type: 'checkbox'，选中意味着变量的值为true。默认绑定变量的值会是 Boolean ，选中为 true 。 ",-1)])),_:1}),t[7]||(t[7]=e("h2",{id:"禁用状态",tabindex:"-1"},[d("禁用状态 "),e("a",{class:"header-anchor",href:"#禁用状态","aria-label":'Permalink to "禁用状态"'},"​")],-1)),t[8]||(t[8]=e("p",null,"多选框不可用状态。",-1)),a(r,{type:"form",config:[{type:"checkbox",name:"checkbox",text:"选项",disabled:()=>!0}]},{source:o(()=>t[1]||(t[1]=[e("p",null," 设置 disabled 属性即可，它接受一个 Boolean ， true 为禁用，也可以接受一个返回 Boolean 的函数。 ",-1)])),_:1}),t[9]||(t[9]=e("h2",{id:"多选框组",tabindex:"-1"},[d("多选框组 "),e("a",{class:"header-anchor",href:"#多选框组","aria-label":'Permalink to "多选框组"'},"​")],-1)),t[10]||(t[10]=e("p",null,"适用于多个勾选框绑定到同一个数组的情景，通过是否勾选来表示这一组选项中选中的项。",-1)),a(r,{type:"form",config:[{type:"checkbox-group",name:"checkbox",text:"选项",options:[{text:"选项1",value:1},{text:"选项2",value:2}]}]},{source:o(()=>t[2]||(t[2]=[e("p",null," checkbox-group 元素能把多个 checkbox 管理为一组。 ",-1)])),_:1}),t[11]||(t[11]=b('<h2 id="checkbox-attributes" tabindex="-1">Checkbox Attributes <a class="header-anchor" href="#checkbox-attributes" aria-label="Permalink to &quot;Checkbox Attributes&quot;">​</a></h2><table tabindex="0"><thead><tr><th>参数</th><th>说明</th><th>类型</th><th>可选值</th><th>默认值</th></tr></thead><tbody><tr><td>name</td><td>绑定值</td><td>string</td><td>—</td><td>—</td></tr><tr><td>text</td><td>表单标签</td><td>string</td><td>—</td><td>—</td></tr><tr><td>disabled</td><td>是否禁用</td><td>boolean / <a href="https://github.com/Tencent/tmagic-editor/blob/master/packages/form/src/schema.ts" target="_blank" rel="noreferrer">FilterFunction</a></td><td>—</td><td>false</td></tr><tr><td>activeValue</td><td>选中时的值</td><td>string / number / Function</td><td>—</td><td>1</td></tr><tr><td>inactiveValue</td><td>没有选中时的值</td><td>string / number / Function</td><td>—</td><td>0</td></tr><tr><td>onChange</td><td>值变化时触发的函数</td><td><a href="https://github.com/Tencent/tmagic-editor/blob/master/packages/form/src/schema.ts" target="_blank" rel="noreferrer">OnChangeHandler </a></td><td>—</td><td>-</td></tr></tbody></table><h2 id="checkboxgroup-attributes" tabindex="-1">CheckboxGroup Attributes <a class="header-anchor" href="#checkboxgroup-attributes" aria-label="Permalink to &quot;CheckboxGroup Attributes&quot;">​</a></h2><table tabindex="0"><thead><tr><th>参数</th><th>说明</th><th>类型</th><th>可选值</th><th>默认值</th></tr></thead><tbody><tr><td>name</td><td>绑定值</td><td>string</td><td>—</td><td>—</td></tr><tr><td>text</td><td>表单标签</td><td>string</td><td>—</td><td>—</td></tr><tr><td>disabled</td><td>是否禁用</td><td>boolean / <a href="https://github.com/Tencent/tmagic-editor/blob/master/packages/form/src/schema.ts" target="_blank" rel="noreferrer">FilterFunction</a></td><td>—</td><td>false</td></tr><tr><td>onChange</td><td>值变化时触发的函数</td><td><a href="https://github.com/Tencent/tmagic-editor/blob/master/packages/form/src/schema.ts" target="_blank" rel="noreferrer">OnChangeHandler</a></td><td>—</td><td>-</td></tr><tr><td>options</td><td>选项</td><td>Array</td><td>—</td><td>-</td></tr></tbody></table>',4))])}const C=n(h,[["render",c]]);export{g as __pageData,C as default};