♻️ chore: 完善 demo 示例

ant-design · Dec 19, 2023 · 8a593e0 · 8a593e0
1 parent 4f37d45
commit 8a593e0
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 6 deletions.
diff --git a/src/ColumnList/demos/customCreate.tsx b/src/ColumnList/demos/customCreate.tsx
@@ -1,6 +1,6 @@
 /**
  * title: 自定义创建逻辑
- * description: 你可以设置 `creatorButtonProps={false}` 来关闭默认的创建效果，然后自定义创建逻辑
+ * description: 你可以设置 `style` 属性来隐藏默认添加按钮，然后自定义创建按钮
  */
 import { PlusCircleTwoTone } from '@ant-design/icons';
 import type { ColumnItemList, SortableListRef } from '@ant-design/pro-editor';
@@ -58,9 +58,14 @@ const columns: ColumnItemList<SchemaItem> = [
 export default () => {
   const ref = useRef<SortableListRef<SchemaItem>>(null);
 
-  const handleCreate = () => {
+  const createNewRecord = () => {
     const id = `id-${randomIndex()}}`;
-    ref.current.addItem({ dataIndex: id, title: `new-${id}`, valueType: 'text' });
+    return { dataIndex: '', title: `new-${id}`, valueType: 'text' };
+  };
+
+  const handleCreate = () => {
+    const data = createNewRecord();
+    ref.current.addItem(data);
   };
 
   return (
@@ -93,7 +98,7 @@ export default () => {
         onChange={(values) => {
           console.log('onChange', values);
         }}
-        creatorButtonProps={false}
+        creatorButtonProps={{ style: { display: 'none' }, record: createNewRecord }}
       />
     </>
   );

diff --git a/src/ColumnList/renderItem/Input.tsx b/src/ColumnList/renderItem/Input.tsx
@@ -62,7 +62,7 @@ const ControlInput = memo<ItemRenderProps>(
       setTimeout(() => {
         const nextNodeEl = document.getElementById(customListId(index + 1));
         nextNodeEl?.focus();
-      }, 200);
+      }, 0);
     };
 
     return (

diff --git a/src/SortableList/demos/Basic.tsx b/src/SortableList/demos/Basic.tsx
@@ -1,6 +1,6 @@
 /**
  * title: 默认使用
- * description: 默认内容区域渲染 `id`，可通过 `renderContent` 来自定义渲染内容。
+ * description: 默认支持列表渲染
  * compact: true
  */
 import { SortableList } from '@ant-design/pro-editor';