diff --git a/packages/react-table/README.md b/packages/react-table/README.md
index 0fc5d69ad8..de95f97d6c 100644
--- a/packages/react-table/README.md
+++ b/packages/react-table/README.md
@@ -729,9 +729,6 @@ ReactDOM.render(, _mount_);
可以通过设置 indentSize 以控制每一层的缩进宽度
-> ⚠️ 注意: 树形数据展示和`expandable.expandedRowRender`请不要同时出现,后续或将支持
-
-
```jsx
import ReactDOM from 'react-dom';
@@ -805,7 +802,7 @@ const Demo = () => {
)
@@ -968,7 +965,8 @@ ReactDOM.render(, _mount_);
### expandable
-注意 expandedRowKeys 与 onExpandedRowsChange 必须成对出现
+> ⚠️ 注意: expandedRowKeys 与 onExpandedRowsChange 必须同时出现或不出现
+
| 参数 | 说明 | 类型 | 默认值 |
|--------- |-------- |--------- |-------- |
diff --git a/packages/react-table/src/TableTr.tsx b/packages/react-table/src/TableTr.tsx
index ce05e5c540..2f1d2d7cff 100644
--- a/packages/react-table/src/TableTr.tsx
+++ b/packages/react-table/src/TableTr.tsx
@@ -38,9 +38,11 @@ export default function TableTr(props: TableTr
locationWidth,
} = props;
const [isOpacity, setIsOpacity] = useState(false);
+ const [childrenIndex, setChildrenIndex] = useState(0);
const [expandIndex, setExpandIndex] = useState>([]);
useEffect(() => {
setIsOpacity(!!data?.find((it) => it[childrenColumnName]));
+ setChildrenIndex(keys?.findIndex((it) => it.key === 'uiw-expanded') === -1 ? 0 : 1);
}, [data]);
const IconDom = useMemo(() => {
@@ -92,7 +94,7 @@ export default function TableTr(props: TableTr
}
}
const isHasChildren = Array.isArray(trData[childrenColumnName]);
- if (colNum === 0 && (isOpacity || hierarchy || isHasChildren)) {
+ if (colNum === childrenIndex && (isOpacity || hierarchy || isHasChildren)) {
objs.children = (
<>
{IconDom(key, isHasChildren)}
@@ -126,10 +128,10 @@ export default function TableTr(props: TableTr
);
})}
+ {isExpandedDom(trData, rowNum)}
{expandIndex.includes(key) && (
)}
- {isExpandedDom(trData, rowNum)}
);
})}
diff --git a/packages/react-table/src/index.tsx b/packages/react-table/src/index.tsx
index 445e4492ce..1a2fc640bc 100644
--- a/packages/react-table/src/index.tsx
+++ b/packages/react-table/src/index.tsx
@@ -131,9 +131,20 @@ export default function Table(props: TablePro
return finalLocationWidth.current;
};
useEffect(() => {
+ const childKey = expandable?.childrenColumnName || 'children';
+ const deep = (params: TableColumns) => {
+ const arr1: Array = [];
+ const arr = params.map((it: T, index: number) => {
+ if (Array.isArray(it[childKey])) {
+ arr1.push(...deep(it[childKey]));
+ }
+ return rowKey ? it[rowKey] : index;
+ });
+ return [...arr1, ...arr];
+ };
if (expandable) {
if (expandable.defaultExpandAllRows) {
- setExpandIndex(data.map((it, index) => (rowKey ? it[rowKey] : index)));
+ setExpandIndex(deep(data));
return;
}
if (expandable.defaultExpandedRowKeys) {