test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-11-30 02:59:04 +08:00
Code Issues Actions 68 Packages Projects Releases Wiki Activity

chore: use react internal replace PureRenderMixin (#21876)

Browse Source
This commit is contained in:
偏右 2020-03-05 13:19:00 +08:00 committed by GitHub
parent 915590a2ff
commit bd97e7254a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 42 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
components/transfer/ListItem.tsx
View File

@ -1,38 +1,44 @@
import * as React from 'react';
import classNames from 'classnames';
import PureRenderMixin from 'rc-util/lib/PureRenderMixin';
import { TransferItem } from '.';
import Checkbox from '../checkbox';
export default class ListItem extends React.Component<any, any> {
shouldComponentUpdate(...args: any[]) {
return PureRenderMixin.shouldComponentUpdate.apply(this, args);
type ListItemProps = {
renderedText?: string | number;
renderedEl: React.ReactNode;
disabled?: boolean;
checked?: boolean;
prefixCls: string;
onClick: (item: TransferItem) => void;
item: TransferItem;
};
const ListItem = (props: ListItemProps) => {
const { renderedText, renderedEl, item, checked, disabled, prefixCls, onClick } = props;
const className = classNames({
[`${prefixCls}-content-item`]: true,
[`${prefixCls}-content-item-disabled`]: disabled || item.disabled,
[`${prefixCls}-content-item-checked`]: checked,
});
let title: string | undefined;
if (typeof renderedText === 'string' || typeof renderedText === 'number') {
title = String(renderedText);
}
render() {
const { renderedText, renderedEl, item, checked, disabled, prefixCls, onClick } = this.props;
const listItem = (
<li
className={className}
title={title}
onClick={disabled || item.disabled ? undefined : () => onClick(item)}
>
<Checkbox checked={checked} disabled={disabled || item.disabled} />
<span className={`${prefixCls}-content-item-text`}>{renderedEl}</span>
</li>
);
const className = classNames({
[`${prefixCls}-content-item`]: true,
[`${prefixCls}-content-item-disabled`]: disabled || item.disabled,
[`${prefixCls}-content-item-checked`]: checked,
});
return listItem;
};
let title: string | undefined;
if (typeof renderedText === 'string' || typeof renderedText === 'number') {
title = String(renderedText);
}
const listItem = (
<li
className={className}
title={title}
onClick={disabled || item.disabled ? undefined : () => onClick(item)}
>
<Checkbox checked={checked} disabled={disabled || item.disabled} />
<span className={`${prefixCls}-content-item-text`}>{renderedEl}</span>
</li>
);
return listItem;
}
}
export default React.memo(ListItem);

4
components/transfer/__tests__/__snapshots__/index.test.js.snap
View File

@ -854,7 +854,7 @@ exports[`Transfer should support render value and label in item 1`] = `
className="ant-transfer-list-content"
onScroll={[Function]}
>
<ListItem
<Memo(ListItem)
checked={false}
item={
Object {
@ -916,7 +916,7 @@ exports[`Transfer should support render value and label in item 1`] = `
label
</span>
</li>
</ListItem>
</Memo(ListItem)>
</ul>
</ListBody>
</div>

10
components/transfer/list.tsx
View File

@ -1,7 +1,6 @@
import * as React from 'react';
import omit from 'omit.js';
import classNames from 'classnames';
import PureRenderMixin from 'rc-util/lib/PureRenderMixin';
import Checkbox from '../checkbox';
import {
TransferItem,
@ -74,7 +73,10 @@ function renderListNode(renderList: RenderListFunction | undefined, props: Trans
};
}
export default class TransferList extends React.Component<TransferListProps, TransferListState> {
export default class TransferList extends React.PureComponent<
TransferListProps,
TransferListState
> {
static defaultProps = {
dataSource: [],
titleText: '',
@ -92,10 +94,6 @@ export default class TransferList extends React.Component<TransferListProps, Tra
};
}
shouldComponentUpdate(...args: any[]) {
return PureRenderMixin.shouldComponentUpdate.apply(this, args);
}
componentWillUnmount() {
clearTimeout(this.triggerScrollTimer);
}