feat: support Transfer[filterOption], close: #2324

components/transfer/demo/search.md

@@ -3,7 +3,7 @@ order: 1
 title: 带搜索框
 ---
 
-带搜索框的穿梭框。
+带搜索框的穿梭框，可以自定义搜索函数。
 
 ````jsx
 import { Transfer } from 'antd';
@@ -35,6 +35,9 @@ const App = React.createClass({
     }
     this.setState({ mockData, targetKeys });
   },
+  filterOption(inputValue, option) {
+    return option.description.indexOf(inputValue) > -1;
+  },
   handleChange(targetKeys) {
     this.setState({ targetKeys });
   },
@@ -43,6 +46,7 @@ const App = React.createClass({
       <Transfer
         dataSource={this.state.mockData}
         showSearch
+        filterOption={this.filterOption}
         targetKeys={this.state.targetKeys}
         onChange={this.handleChange}
         render={item => item.title}

components/transfer/index.jsx

@@ -37,6 +37,7 @@ export default class Transfer extends React.Component {
     titles: PropTypes.array,
     operations: PropTypes.array,
     showSearch: PropTypes.bool,
+    filterOption: PropTypes.func,
     searchPlaceholder: PropTypes.string,
     notFoundContent: PropTypes.node,
     body: PropTypes.func,
@@ -187,7 +188,7 @@ export default class Transfer extends React.Component {
     const {
       prefixCls, titles, operations, showSearch, notFoundContent,
       searchPlaceholder, body, footer, listStyle, className,
-      render,
+      filterOption, render,
     } = this.props;
     const { leftFilter, rightFilter, leftCheckedKeys, rightCheckedKeys } = this.state;
 
@@ -205,6 +206,7 @@ export default class Transfer extends React.Component {
         <List titleText={titles[0]}
           dataSource={leftDataSource}
           filter={leftFilter}
+          filterOption={filterOption}
           style={listStyle}
           checkedKeys={leftCheckedKeys}
           handleFilter={this.handleLeftFilter}
@@ -230,6 +232,7 @@ export default class Transfer extends React.Component {
         <List titleText={titles[1]}
           dataSource={rightDataSource}
           filter={rightFilter}
+          filterOption={filterOption}
           style={listStyle}
           checkedKeys={rightCheckedKeys}
           handleFilter={this.handleRightFilter}

components/transfer/index.md

@@ -26,6 +26,7 @@ english: Transfer
 | titles | 标题集合,顺序从左至右 | Array | ['源列表', '目的列表'] |
 | operations | 操作文案集合,顺序从上至下 | Array | [] |
 | showSearch | 是否显示搜索框 | Boolean | false |
+| filterOption | 接收 `inputValue` `option` 两个参数，当 `option` 符合筛选条件时，应返回 `true`，反之则返回 `false`。| Function(inputValue, option) | |
 | searchPlaceholder | 搜索框的默认值 | String | '请输入搜索内容' |
 | notFoundContent | 当列表为空时显示的内容 | React.node | '列表为空'  |
 | footer | 底部渲染函数 | Function(props) |  |

components/transfer/list.jsx

@@ -32,6 +32,7 @@ export default class TransferList extends React.Component {
     prefixCls: PropTypes.string,
     dataSource: PropTypes.array,
     showSearch: PropTypes.bool,
+    filterOption: PropTypes.func,
     searchPlaceholder: PropTypes.string,
     titleText: PropTypes.string,
     style: PropTypes.object,
@@ -116,7 +117,11 @@ export default class TransferList extends React.Component {
     );
   }
 
-  matchFilter(text, filterText) {
+  matchFilter(filterText, item, text) {
+    const filterOption = this.props.filterOption;
+    if (filterOption) {
+      return filterOption(filterText, item);
+    }
     return text.indexOf(filterText) >= 0;
   }
 
@@ -150,7 +155,7 @@ export default class TransferList extends React.Component {
         renderedEl = renderResult;
       }
 
-      if (filter && filter.trim() && !this.matchFilter(renderedText, filter)) {
+      if (filter && filter.trim() && !this.matchFilter(filter, item, renderedText)) {
         return null;
       }