报错兼容

build/Transfer.js

@@ -250,6 +250,7 @@ var Transfer = function (_React$Component) {
       'div',
       { className: cls },
       _react2["default"].createElement(_list2["default"], {
+        position: 'left',
         titleText: titles[0],
         dataSource: leftDataSource,
         filter: leftFilter,
@@ -280,6 +281,7 @@ var Transfer = function (_React$Component) {
         renderOperation: renderOperation
       }),
       _react2["default"].createElement(_list2["default"], {
+        position: 'right',
         titleText: titles[1],
         dataSource: rightDataSource,
         filter: rightFilter,

build/item.js

@@ -69,8 +69,16 @@ var Item = function (_React$Component) {
     }, _this.highlightFilter = function (text, filter) {
       var prefixCls = _this.props.prefixCls;
 
-      text = text.replace(filter, '<i class="' + prefixCls + '-content-item-filter">' + filter + '</i>');
-      return text;
+      if (typeof text == 'string') {
+        text = text.replace(filter, '<i class="' + prefixCls + '-content-item-filter">' + filter + '</i>');
+        return _react2["default"].createElement('span', { dangerouslySetInnerHTML: { __html: text } });
+      } else {
+        return _react2["default"].createElement(
+          'span',
+          null,
+          text
+        );
+      }
     }, _temp), _possibleConstructorReturn(_this, _ret);
   }
 
@@ -123,7 +131,7 @@ var Item = function (_React$Component) {
         _react2["default"].createElement(_beeCheckbox2["default"], { checked: checked, disabled: item.disabled, onClick: item.disabled ? undefined : function () {
             return onClick(item);
           } }),
-        _react2["default"].createElement('span', { dangerouslySetInnerHTML: { __html: this.highlightFilter(renderedEl, filter) } })
+        this.highlightFilter(renderedEl, filter)
       );
     } else {
       return _react2["default"].createElement(
@@ -141,7 +149,7 @@ var Item = function (_React$Component) {
           _react2["default"].createElement(_beeCheckbox2["default"], { checked: checked, disabled: item.disabled, onClick: item.disabled ? undefined : function () {
               return onClick(item);
             } }),
-          _react2["default"].createElement('span', { dangerouslySetInnerHTML: { __html: this.highlightFilter(renderedEl, filter) } })
+          this.highlightFilter(renderedEl, filter)
         )
       );
     }

build/list.js

@@ -99,10 +99,13 @@ var TransferList = function (_React$Component) {
     };
 
     _this.renderItem = function (item) {
-      var _this$props$render = _this.props.render,
-          render = _this$props$render === undefined ? noop : _this$props$render;
+      var _this$props2 = _this.props,
+          _this$props2$render = _this$props2.render,
+          render = _this$props2$render === undefined ? noop : _this$props2$render,
+          filter = _this$props2.filter,
+          position = _this$props2.position;
 
-      var renderResult = render(item);
+      var renderResult = render(item, filter, position);
       var isRenderResultPlain = isRenderResultPlainObject(renderResult);
       return {
         renderedText: isRenderResultPlain ? renderResult.value : renderResult,

demo/demolist/Demo2.js

@@ -48,7 +48,11 @@ class Demo2 extends React.Component {
         filterOption={this.filterOption}
         targetKeys={this.state.targetKeys}
         onChange={this.handleChange}
-        render={item => item.title}
+        render={(item,position,filter) => {
+          // console.log('position',position)
+          // console.log('filter',filter)
+          return item.title
+        }}
       />
     );
   }

docs/api.md

@@ -9,7 +9,7 @@
 |参数|说明|类型|默认值|
 |:--|:---:|:--:|---:|
 |dataSource|设置数据源。当有targetKey props存在时，dataSource的数据刨去targetKey数据,剩下的都放在左边列表|[]|[]|
-|render|自定义的展示出来的item,需要展示哪些字段|Function(record)|-|
+|render|自定义的展示出来的item,需要展示哪些字段|Function(record,'left'|'right',filter)|-|
 |targetKeys|展示在右边列表的数据集|[]|[]|
 |selectedKeys|所有选中的item的keys|[]|[]|
 |onChange|当item在穿梭成功后的回调 参数(targetKeys, direction, moveKeys)|func|-|

package.json

@@ -1,6 +1,6 @@
 {
  "name": "bee-transfer",
- "version": "1.0.8-ncc.1",
+ "version": "1.0.8-ncc.2",
  "description": "Transfer ui component for react",
  "keywords": [
   "react",

src/Transfer.js

@@ -240,6 +240,7 @@ class Transfer extends React.Component{
     return (
       <div className={cls}>
         <List
+          position="left"
           titleText={titles[0]}
           dataSource={leftDataSource}
           filter={leftFilter}
@@ -270,6 +271,7 @@ class Transfer extends React.Component{
           renderOperation={renderOperation}
         />
         <List
+          position="right"
           titleText={titles[1]}
           dataSource={rightDataSource}
           filter={rightFilter}

src/item.js

@@ -23,8 +23,12 @@ class Item extends React.Component{
   }
   highlightFilter = (text,filter) =>{
     let { prefixCls } = this.props;
-    text = text.replace(filter,'<i class="'+prefixCls+'-content-item-filter">'+filter+'</i>');
-    return text;
+    if(typeof text=='string'){
+      text = text.replace(filter,'<i class="'+prefixCls+'-content-item-filter">'+filter+'</i>');
+      return <span dangerouslySetInnerHTML={{__html:text}}></span>
+    }else{
+      return <span>{text}</span>
+    }
   }
   render() {
     const { render, filter, item, lazy, checked, prefixCls, onClick,renderedText,renderedEl } = this.props;
@@ -54,7 +58,7 @@ class Item extends React.Component{
           onClick={item.disabled ? undefined : () => onClick(item)}
         >
           <Checkbox checked={checked} disabled={item.disabled} onClick={item.disabled ? undefined : () => onClick(item)}/>
-          <span dangerouslySetInnerHTML={{__html:this.highlightFilter(renderedEl,filter)}}></span>
+          {this.highlightFilter(renderedEl,filter)}
         </li>
       )
     }else {
@@ -66,7 +70,7 @@ class Item extends React.Component{
               onClick={item.disabled ? undefined : () => onClick(item)}
             >
               <Checkbox checked={checked} disabled={item.disabled} onClick={item.disabled ? undefined : () => onClick(item)}/>
-              <span dangerouslySetInnerHTML={{__html:this.highlightFilter(renderedEl,filter)}}></span>
+              {this.highlightFilter(renderedEl,filter)}
             </li>
           </Lazyload>
         );

src/list.js

@@ -79,8 +79,8 @@ class TransferList extends React.Component {
     this.props.handleClear();
   }
   renderItem = (item) => {
-    const { render = noop } = this.props;
-    const renderResult = render(item);
+    const { render = noop,filter,position } = this.props;
+    const renderResult = render(item,filter,position);
     const isRenderResultPlain = isRenderResultPlainObject(renderResult);
     return {
       renderedText: isRenderResultPlain ? renderResult.value : renderResult,