Fix Table multiple levels filter menu (#4548)

fix #4541

components/table/__tests__/Table.filter.test.js

@@ -4,7 +4,7 @@ import { renderToJson } from 'enzyme-to-json';
 import Table from '..';
 
 describe('Table.filter', () => {
-  const filterFn = (value, record) => record.name === 'Lucy';
+  const filterFn = (value, record) => record.name.indexOf(value) !== -1;
   const column = {
     title: 'Name',
     dataIndex: 'name',
@@ -41,6 +41,10 @@ describe('Table.filter', () => {
     );
   }
 
+  function renderedNames(wrapper) {
+    return wrapper.find('TableRow').map(row => row.props().record.name);
+  }
+
   it('renders filter correctly', () => {
     const wrapper = render(createTable());
 
@@ -116,7 +120,7 @@ describe('Table.filter', () => {
     const wrapper = mount(createTable({
       columns: [{
         ...column,
-        filteredValue: ['girl'],
+        filteredValue: ['Lucy'],
       }],
     }));
 
@@ -154,4 +158,40 @@ describe('Table.filter', () => {
 
     expect(handleChange).toBeCalledWith({}, { name: ['boy'] }, {});
   });
+
+  it('three levels menu', () => {
+    const filters = [
+      { text: 'Upper', value: 'Upper' },
+      { text: 'Lower', value: 'Lower' },
+      {
+        text: 'Level2',
+        value: 'Level2',
+        children: [
+          { text: 'Large', value: 'Large' },
+          { text: 'Small', value: 'Small' },
+          {
+            text: 'Level3',
+            value: 'Level3',
+            children: [
+              { text: 'Black', value: 'Black' },
+              { text: 'White', value: 'White' },
+              { text: 'Jack', value: 'Jack' },
+            ],
+          },
+        ],
+      },
+    ];
+    const wrapper = mount(createTable({
+      columns: [{
+        ...column,
+        filters,
+      }],
+    }));
+    const dropdownWrapper = mount(wrapper.find('Trigger').node.getComponent());
+    dropdownWrapper.find('.ant-dropdown-menu-submenu-title').at(0).simulate('mouseEnter');
+    dropdownWrapper.find('.ant-dropdown-menu-submenu-title').at(1).simulate('mouseEnter');
+    dropdownWrapper.find('MenuItem').last().simulate('click');
+    dropdownWrapper.find('.confirm').simulate('click');
+    expect(renderedNames(wrapper)).toEqual(['Jack']);
+  });
 });

components/table/filterDropdown.tsx

@@ -122,7 +122,7 @@ export default class FilterMenu extends React.Component<FilterMenuProps, any> {
         const subMenuCls = containSelected ? `${this.props.dropdownPrefixCls}-submenu-contain-selected` : '';
         return (
           <SubMenu title={item.text} className={subMenuCls} key={item.value.toString()}>
-            {item.children.map(child => this.renderMenuItem(child))}
+            {this.renderMenus(item.children)}
           </SubMenu>
         );
       }