demo: update demo type React.ReactNode => React.PropsWithChildren

ant-design · May 5, 2024 · 7b9dbf1 · 7b9dbf1
1 parent 313d534
commit 7b9dbf1
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 8 deletions.
diff --git a/components/button/__tests__/index.test.tsx b/components/button/__tests__/index.test.tsx
@@ -88,7 +88,7 @@ describe('Button', () => {
   });
 
   it('renders Chinese characters correctly in HOC', () => {
-    const Text = ({ children }: { children: React.ReactNode }) => <span>{children}</span>;
+    const Text: React.FC<React.PropsWithChildren> = ({ children }) => <span>{children}</span>;
     const { container, rerender } = render(
       <Button>
         <Text>按钮</Text>

diff --git a/components/form/demo/form-item-path.tsx b/components/form/demo/form-item-path.tsx
@@ -6,14 +6,16 @@ const MyFormItemContext = React.createContext<(string | number)[]>([]);
 
 interface MyFormItemGroupProps {
   prefix: string | number | (string | number)[];
-  children: React.ReactNode;
 }
 
 function toArr(str: string | number | (string | number)[]): (string | number)[] {
   return Array.isArray(str) ? str : [str];
 }
 
-const MyFormItemGroup = ({ prefix, children }: MyFormItemGroupProps) => {
+const MyFormItemGroup: React.FC<React.PropsWithChildren<MyFormItemGroupProps>> = ({
+  prefix,
+  children,
+}) => {
   const prefixPath = React.useContext(MyFormItemContext);
   const concatPath = React.useMemo(() => [...prefixPath, ...toArr(prefix)], [prefixPath, prefix]);
 

diff --git a/components/grid/demo/flex-align.tsx b/components/grid/demo/flex-align.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { Col, Divider, Row } from 'antd';
 
-const DemoBox: React.FC<{ children: React.ReactNode; value: number }> = (props) => (
+const DemoBox: React.FC<React.PropsWithChildren<{ value: number }>> = (props) => (
   <p className={`height-${props.value}`}>{props.children}</p>
 );
 

diff --git a/components/table/demo/edit-cell.tsx b/components/table/demo/edit-cell.tsx
@@ -31,13 +31,12 @@ const EditableRow: React.FC<EditableRowProps> = ({ index, ...props }) => {
 interface EditableCellProps {
   title: React.ReactNode;
   editable: boolean;
-  children: React.ReactNode;
   dataIndex: keyof Item;
   record: Item;
   handleSave: (record: Item) => void;
 }
 
-const EditableCell: React.FC<EditableCellProps> = ({
+const EditableCell: React.FC<React.PropsWithChildren<EditableCellProps>> = ({
   title,
   editable,
   children,

diff --git a/components/table/demo/edit-row.tsx b/components/table/demo/edit-row.tsx
@@ -25,10 +25,9 @@ interface EditableCellProps extends React.HTMLAttributes<HTMLElement> {
   inputType: 'number' | 'text';
   record: Item;
   index: number;
-  children: React.ReactNode;
 }
 
-const EditableCell: React.FC<EditableCellProps> = ({
+const EditableCell: React.FC<React.PropsWithChildren<EditableCellProps>> = ({
   editing,
   dataIndex,
   title,