显示的数据总数根据选中的数据动态变化

dist/demo.css

@@ -5471,6 +5471,8 @@ input.u-button[type="submit"] {
   .u-form-control:focus {
     border-color: #66afe9;
     outline: 0; }
+  .u-form-control::-ms-clear, .u-form-control ::-ms-reveal {
+    display: none; }
 
 .u-form-control[disabled] {
   background: #eee;
@@ -5528,7 +5530,11 @@ input.u-button[type="submit"] {
 /*  Navlayout  */
 .u-checkbox {
   display: inline-block;
-  position: relative; }
+  position: relative;
+  margin: 0 5px;
+  height: 18px;
+  line-height: 18px;
+  font-size: 14px; }
   .u-checkbox.disabled .u-checkbox-label {
     cursor: not-allowed;
     opacity: 0.5; }
@@ -5560,7 +5566,7 @@ input.u-button[type="submit"] {
       width: 18px;
       height: 18px;
       left: 0;
-      top: 4px;
+      top: 0;
       text-align: center;
       position: absolute; }
     .u-checkbox .u-checkbox-label:after {
@@ -5570,7 +5576,7 @@ input.u-button[type="submit"] {
       width: 18px;
       height: 18px;
       left: 0;
-      top: 4px;
+      top: 0;
       text-align: center;
       position: absolute; }
 

src/item.js

@@ -22,23 +22,7 @@ class Item extends React.Component{
     return text.indexOf(filter) >= 0;
   }
   render() {
-    const { render, filter, item, lazy, checked, prefixCls, onClick } = this.props;
-
-    const renderResult = render(item);
-    let renderedText;
-    let renderedEl;
-    if (isRenderResultPlainObject(renderResult)) {
-      renderedText = renderResult.value;
-      renderedEl = renderResult.label;
-    } else {
-      renderedText = renderResult;
-      renderedEl = renderResult;
-    }
-
-    if (filter && filter.trim() && !this.matchFilter(renderedText)) {
-      return null;
-    }
-
+    const { render, filter, item, lazy, checked, prefixCls, onClick,renderedText,renderedEl } = this.props;
     const className = classNames({
       [`${prefixCls}-content-item`]: true,
       [`${prefixCls}-content-item-disabled`]: item.disabled,

src/list.js

@@ -17,6 +17,10 @@ const defaultProps = {
   showSearch: false,
   render: noop,
 }; 
+function isRenderResultPlainObject(result) {
+  return result && !React.isValidElement(result) &&
+    Object.prototype.toString.call(result) === '[object Object]';
+}
 
 class TransferList extends React.Component {
 
@@ -43,6 +47,14 @@ class TransferList extends React.Component {
     return PureRenderMixin.shouldComponentUpdate.apply(this, args);
   }
 
+
+  matchFilter = (text,item) => {
+    const { filter, filterOption} = this.props;
+    if (filterOption) {
+      return filterOption(filter, item);
+    }
+    return text.indexOf(filter) >= 0;
+  }
   getCheckStatus(filteredDataSource) {
     const { checkedKeys } = this.props;
     if (checkedKeys.length === 0) {
@@ -66,7 +78,15 @@ class TransferList extends React.Component {
   handleClear = () => {
     this.props.handleClear();
   }
-
+  renderItem = (item) => {
+    const { render = noop } = this.props;
+    const renderResult = render(item);
+    const isRenderResultPlain = isRenderResultPlainObject(renderResult);
+    return {
+      renderedText: isRenderResultPlain ? renderResult.value : renderResult,
+      renderedEl: isRenderResultPlain ? renderResult.label : renderResult,
+    };
+  }
   renderCheckbox({ prefixCls, filteredDataSource, checked, checkPart, disabled, checkable }) {
     const checkAll = (!checkPart) && checked;
     prefixCls = "u"
@@ -103,11 +123,20 @@ class TransferList extends React.Component {
     });
 
     const filteredDataSource = [];
-
+    const totalDataSource = [];
     const showItems = dataSource.map((item) => {
+      const { renderedText, renderedEl } = this.renderItem(item);
+      if (filter && filter.trim() && !this.matchFilter(renderedText, item)) {
+        return null;
+      }
+
+      // all show items
+      totalDataSource.push(item);
+
       if (!item.disabled) {
         filteredDataSource.push(item);
       }
+      
       const checked = checkedKeys.indexOf(item.key) >= 0;
       return (
         <Item
@@ -115,6 +144,8 @@ class TransferList extends React.Component {
           item={item}
           lazy={lazy}
           render={render}
+          renderedText={renderedText}
+          renderedEl={renderedEl}
           filter={filter}
           filterOption={filterOption}
           checked={checked}
@@ -185,7 +216,7 @@ class TransferList extends React.Component {
           {renderedCheckbox}
           <span className={`${prefixCls}-header-selected`}>
             <span>
-              {(checkedKeys.length > 0 ? `${checkedKeys.length}/` : '') + dataSource.length} {unit}
+              {(checkedKeys.length > 0 ? `${checkedKeys.length}/` : '') + totalDataSource.length} {unit}
             </span>
             <span className={`${prefixCls}-header-title`}>
               {titleText}