From d0532db3d79622eead88d704de1bc5d8f78dc4ed Mon Sep 17 00:00:00 2001 From: RaoHai Date: Mon, 30 May 2016 16:59:21 +0800 Subject: [PATCH 1/2] add rowKey props to Transfer + close #1900 --- components/transfer/index.jsx | 10 +++++++++- components/transfer/index.md | 11 +++++++++++ 2 files changed, 20 insertions(+), 1 deletion(-) diff --git a/components/transfer/index.jsx b/components/transfer/index.jsx index 79b0c6ba9c..c3570ce64d 100644 --- a/components/transfer/index.jsx +++ b/components/transfer/index.jsx @@ -41,6 +41,7 @@ export default class Transfer extends React.Component { notFoundContent: PropTypes.node, body: PropTypes.func, footer: PropTypes.func, + rowKey: PropTypes.func, }; constructor(props) { @@ -61,8 +62,15 @@ export default class Transfer extends React.Component { }); } splitDataSource(props) { - const { targetKeys, dataSource } = props; + const { targetKeys } = props; + let { dataSource } = props; + if (props.rowKey && typeof props.rowKey === 'function') { + dataSource = dataSource.map(record => { + record.key = props.rowKey(record); + return record; + }); + } let leftDataSource = [...dataSource]; let rightDataSource = []; diff --git a/components/transfer/index.md b/components/transfer/index.md index 030751e01f..a4f8e71156 100644 --- a/components/transfer/index.md +++ b/components/transfer/index.md @@ -29,3 +29,14 @@ english: Transfer | searchPlaceholder | 搜索框的默认值 | String | '请输入搜索内容' | | notFoundContent | 当列表为空时显示的内容 | React.node | '列表为空' | | footer | 底部渲染函数 | Function(props) | | + + +## 注意 + +按照 React 的[规范](http://facebook.github.io/react/docs/multiple-components.html#dynamic-children),所有的组件数组必须绑定 key。在 Transfer 中,`dataSource`里的数据值需要指定 `key` 值。对于 `dataSource` 默认将每列数据的 `key` 属性作为唯一的标识。 + +如果你的数据没有这个属性,务必使用 `rowKey` 来指定数据列的主键。 +```jsx +// 比如你的数据主键是 uid +return record.uid} />; +``` \ No newline at end of file From a243d32dff46575aec29ae4970eff76dba830b74 Mon Sep 17 00:00:00 2001 From: RaoHai Date: Thu, 2 Jun 2016 16:15:19 +0800 Subject: [PATCH 2/2] remove typeof props.rowKey --- components/transfer/index.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/transfer/index.jsx b/components/transfer/index.jsx index c3570ce64d..9167345542 100644 --- a/components/transfer/index.jsx +++ b/components/transfer/index.jsx @@ -65,7 +65,7 @@ export default class Transfer extends React.Component { const { targetKeys } = props; let { dataSource } = props; - if (props.rowKey && typeof props.rowKey === 'function') { + if (props.rowKey) { dataSource = dataSource.map(record => { record.key = props.rowKey(record); return record;