fix(Menu): filter duplicate keys

alibaba-fusion · Mar 22, 2019 · e8e6e52 · e8e6e52
1 parent 70c1bc4
commit e8e6e52
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 0 deletions.
diff --git a/src/menu/view/menu.jsx b/src/menu/view/menu.jsx
@@ -301,6 +301,7 @@ export default class Menu extends Component {
         this.k2n = {};
         this.p2n = {};
         const loop = (children, posPrefix, indexWrapper = { index: 0 }) => {
+            const keyArray = [];
             return Children.map(children, child => {
                 if (
                     child &&
@@ -320,6 +321,14 @@ export default class Menu extends Component {
                         pos = `${posPrefix}-${indexWrapper.index++}`;
                         const key =
                             typeof child.key === 'string' ? child.key : pos;
+
+                        // filter out duplicate keys
+                        if (keyArray.indexOf(key) > -1) {
+                            return;
+                        }
+
+                        keyArray.push(key);
+
                         const level = pos.split('-').length - 1;
                         this.k2n[key] = this.p2n[pos] = {
                             key,

diff --git a/test/menu/index-spec.js b/test/menu/index-spec.js
@@ -67,6 +67,23 @@ describe('Menu', () => {
         assert(item.find('.next-menu-item-helper').text() === 'helper');
     });
 
+    it('should filter duplicate keys', () => {
+        wrapper = mount(
+            <Menu>
+                <Item key="1">item1</Item>
+                <Item key="2">item2</Item>
+                <Item key="2">item2</Item>
+                <Item key="2">item2</Item>
+                <Item>item</Item>
+            </Menu>
+        );
+        const item = wrapper.find('.next-menu-item');
+        assert(item.length === 3);
+        assert(item.at(0).props().title === 'item1');
+        assert(item.at(1).props().title === 'item2');
+        assert(item.at(2).props().title === 'item');
+    });
+
     it('should pass className', () => {
         wrapper = mount(
             <Menu