---
order: 0
title: 基本
description: 使用 Checkbox 渲染的基本组件
---

````jsx
import CheckboxField from '@alicd/crui-checkbox-field';
import { Form } from '@alicd/next';

ReactDOM.render(
  <Form>
      <h6>无标签不同状态的样子</h6>
      <CheckboxField label="未选中："/>
      <CheckboxField  label="默认选中：" defaultChecked />
      <CheckboxField  label="半选：" defaultIndeterminate />
      <CheckboxField  label="禁用：" disabled />
      <CheckboxField  label="选中时禁用：" disabled checked />
      <CheckboxField  label="选中：" checked />
      <h6>带有label标签的样子</h6>
      <CheckboxField label="选择水果：">香蕉</CheckboxField>
      <CheckboxField label="选择水果：">苹果</CheckboxField>
  </Form>,
  mountNode
);

````

```` template
<Form>
    <h6>无标签不同状态的样子</h6>
    <CheckboxField label="未选中："/>
    <CheckboxField  label="默认选中：" defaultChecked />
    <CheckboxField  label="半选：" defaultIndeterminate />
    <CheckboxField  label="禁用：" disabled />
    <CheckboxField  label="选中时禁用：" disabled checked />
    <CheckboxField  label="选中：" checked />
    <h6>带有label标签的样子</h6>
    <CheckboxField label="选择水果：">香蕉</CheckboxField>
    <CheckboxField label="选择水果：">苹果</CheckboxField>
</Form>
````