Fix transfer search bug, close #5631

components/_util/triggerEvent.tsx

@@ -0,0 +1,8 @@
+export default function triggerEvent(el, type) {
+  if ('createEvent' in document) {
+    // modern browsers, IE9+
+    const e = document.createEvent('HTMLEvents');
+    e.initEvent(type, false, true);
+    el.dispatchEvent(e);
+  }
+}

components/transfer/list.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { findDOMNode } from 'react-dom';
 import classNames from 'classnames';
 import Animate from 'rc-animate';
 import PureRenderMixin from 'rc-util/lib/PureRenderMixin';
@@ -7,6 +8,7 @@ import Checkbox from '../checkbox';
 import { TransferItem } from './index';
 import Search from './search';
 import Item from './item';
+import triggerEvent from '../_util/triggerEvent';
 
 function noop() {
 }
@@ -50,6 +52,7 @@ export default class TransferList extends React.Component<TransferListProps, any
   };
 
   timer: number;
+  triggerScrollTimer: number;
 
   constructor(props) {
     super(props);
@@ -68,6 +71,7 @@ export default class TransferList extends React.Component<TransferListProps, any
 
   componentWillUnmount() {
     clearTimeout(this.timer);
+    clearTimeout(this.triggerScrollTimer);
   }
 
   shouldComponentUpdate(...args) {
@@ -92,6 +96,17 @@ export default class TransferList extends React.Component<TransferListProps, any
 
   handleFilter = (e) => {
     this.props.handleFilter(e);
+    if (!e.target.value) {
+      return;
+    }
+    // Manually trigger scroll event for lazy search bug
+    // https://github.com/ant-design/ant-design/issues/5631
+    this.triggerScrollTimer = setTimeout(() => {
+      const listNode = findDOMNode(this).querySelectorAll('.ant-transfer-list-content')[0];
+      if (listNode) {
+        triggerEvent(listNode, 'scroll');
+      }
+    }, 0);
   }
 
   handleClear = () => {