Merge pull request #303 from yuanmeda/fix/doc-checkbox413

docs(checkbox): update docs and demo
Tencent · Oct 27, 2022 · 80ae43d · 80ae43d
2 parents 801920c + f8efe2d
commit 80ae43d
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 18 deletions.
diff --git a/src/checkbox/_example/disable.jsx b/src/checkbox/_example/disable.jsx
@@ -8,6 +8,7 @@ export default function () {
       <Checkbox label="多选" checked disabled />
       <Checkbox label="多选" align="right" disabled />
       <Checkbox label="多选" align="right" checked disabled />
+      <Checkbox label="半选" indeterminate defaultChecked disabled />
     </>
   );
 }
diff --git a/src/checkbox/_example/group.jsx b/src/checkbox/_example/group.jsx
@@ -2,22 +2,22 @@ import React, { useState } from 'react';
 import { Checkbox } from 'tdesign-mobile-react';
 
 export default function CheckboxExample() {
-  const [value, setValue] = useState([]);
+  const [value, setValue] = useState(['1', '2']);
   const options = [
     {
       label: '全选',
       checkAll: true,
     },
     {
-      label: '多选',
+      label: '多选1',
       value: '1',
     },
     {
-      label: '多选',
+      label: '多选2',
       value: '2',
     },
     {
-      label: '多选',
+      label: '多选3',
       value: '3',
     },
   ];

diff --git a/src/checkbox/_example/index.jsx b/src/checkbox/_example/index.jsx
@@ -6,7 +6,6 @@ import Base from './base';
 import Right from './right';
 import Disable from './disable';
 import Group from './group';
-import Indeterminate from './indeterminate';
 import Max from './max';
 import Icon from './icon';
 
@@ -15,44 +14,38 @@ export default function CheckboxDemo() {
     <div className="tdesign-mobile-demo">
       <TDemoHeader title="Checkbox 多选框" summary="用于预设的一组选项中执行多项选择，并呈现选择结果。" />
 
-      <TDemoBlock  title="01 类型" summary="基础多选框">
-        <div className='checkbox-demo'>
+      <TDemoBlock title="01 类型" summary="基础多选框">
+        <div className="checkbox-demo">
           <Base />
         </div>
       </TDemoBlock>
 
       <TDemoBlock summary="右侧多选框">
-        <div className='checkbox-demo'>
+        <div className="checkbox-demo">
           <Right />
         </div>
       </TDemoBlock>
 
       <TDemoBlock summary="带全选的多选框">
-        <div className='checkbox-demo'>
+        <div className="checkbox-demo">
           <Group />
         </div>
       </TDemoBlock>
 
       <TDemoBlock summary="限制最多可选数量">
-        <div className='checkbox-demo'>
+        <div className="checkbox-demo">
           <Max />
         </div>
       </TDemoBlock>
 
       <TDemoBlock title="02 状态" summary="多选框禁用态">
-        <div className='checkbox-demo'>
+        <div className="checkbox-demo">
           <Disable />
         </div>
       </TDemoBlock>
 
-      <TDemoBlock summary="多选框半选态">
-        <div className='checkbox-demo'>
-          <Indeterminate />
-        </div>
-      </TDemoBlock>
-
       <TDemoBlock title="03 特殊类型" summary="自定义图标多选框">
-        <div className='checkbox-demo'>
+        <div className="checkbox-demo">
           <Icon />
         </div>
       </TDemoBlock>