fix: List warning (#24568)

* refactor code

* fix: List not recognize colStyle on DOM node

close #24557
This commit is contained in:
偏右 2020-05-29 15:27:08 +08:00 committed by GitHub
parent 37c894f1a2
commit 2c9ddcb1b2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 20 additions and 16 deletions

View File

@ -58,12 +58,19 @@ export interface ListItemTypeProps extends React.FC<ListItemProps> {
Meta: typeof Meta; Meta: typeof Meta;
} }
const Item: ListItemTypeProps = props => { const Item: ListItemTypeProps = ({
prefixCls: customizePrefixCls,
children,
actions,
extra,
className,
colStyle,
...others
}) => {
const { grid, itemLayout } = React.useContext(ListContext); const { grid, itemLayout } = React.useContext(ListContext);
const { getPrefixCls } = React.useContext(ConfigContext); const { getPrefixCls } = React.useContext(ConfigContext);
const isItemContainsTextNodeAndNotSingular = () => { const isItemContainsTextNodeAndNotSingular = () => {
const { children } = props;
let result; let result;
React.Children.forEach(children, (element: React.ReactElement<any>) => { React.Children.forEach(children, (element: React.ReactElement<any>) => {
if (typeof element === 'string') { if (typeof element === 'string') {
@ -74,22 +81,12 @@ const Item: ListItemTypeProps = props => {
}; };
const isFlexMode = () => { const isFlexMode = () => {
const { extra } = props;
if (itemLayout === 'vertical') { if (itemLayout === 'vertical') {
return !!extra; return !!extra;
} }
return !isItemContainsTextNodeAndNotSingular(); return !isItemContainsTextNodeAndNotSingular();
}; };
const {
prefixCls: customizePrefixCls,
children,
actions,
extra,
className,
colStyle,
...others
} = props;
const prefixCls = getPrefixCls('list', customizePrefixCls); const prefixCls = getPrefixCls('list', customizePrefixCls);
const actionsContent = actions && actions.length > 0 && ( const actionsContent = actions && actions.length > 0 && (
<ul className={`${prefixCls}-item-action`} key="actions"> <ul className={`${prefixCls}-item-action`} key="actions">

View File

@ -245,10 +245,17 @@ function List<T>({
if (splitDataSource.length > 0) { if (splitDataSource.length > 0) {
const items = splitDataSource.map((item: any, index: number) => renderInnerItem(item, index)); const items = splitDataSource.map((item: any, index: number) => renderInnerItem(item, index));
const childrenList = React.Children.map(items, (child: any, index) => const childrenList = React.Children.map(items, (child: any, index) =>
cloneElement(child, { cloneElement(
key: keys[index], child,
colStyle, grid
}), ? {
key: keys[index],
colStyle,
}
: {
key: keys[index],
},
),
); );
childrenContent = grid ? ( childrenContent = grid ? (
<Row gutter={grid.gutter}>{childrenList}</Row> <Row gutter={grid.gutter}>{childrenList}</Row>