Feat:Add FindItem With MenuRef (#759)

* feat: menuRef

* feat: menuRef

* feat: menuRef

* feat:menuRef

* feat:menuRef

---------

Co-authored-by: WB01676250 <jl01676250@antgroup.com>

Author: jin19980928

src/Menu.tsx

@@ -426,6 +426,11 @@ const Menu = React.forwardRef<MenuRef, MenuProps>((props, ref) => {
           elementToFocus?.focus?.(options);
         }
       },
+      findItem: ({ key: itemKey }) => {
+        const keys = getKeys();
+        const { key2element } = refreshElements(keys, uuid);
+        return key2element.get(itemKey) || null;
+      },
     };
   });
 

src/interface.ts

@@ -134,9 +134,12 @@ export type MenuRef = {
    */
   focus: (options?: FocusOptions) => void;
   list: HTMLUListElement;
+  findItem: (params: { key: string }) => HTMLElement | null;
 };
 
 // ======================== Component ========================
 export type ComponentType = 'submenu' | 'item' | 'group' | 'divider';
 
-export type Components = Partial<Record<ComponentType, React.ComponentType<any>>>;
+export type Components = Partial<
+  Record<ComponentType, React.ComponentType<any>>
+>;

tests/Menu.spec.tsx

@@ -807,5 +807,23 @@ describe('Menu', () => {
     rerender(<App expand={false} subExpand />);
     expect(container.querySelectorAll('.rc-menu-submenu-arrow').length).toBe(1);
   });
+
+  it('should find item by key', () => {
+    const menuRef = React.createRef<MenuRef>();
+    const { container } = render(
+      <Menu ref={menuRef}>
+        <MenuItem key="light">Light</MenuItem>
+        <MenuItem key="cat">Cat</MenuItem>
+      </Menu>,
+    );
+
+    const lightItem = menuRef.current?.findItem({ key: 'light' });
+    const catItem = menuRef.current?.findItem({ key: 'cat' });
+    const nonExistentItem = menuRef.current?.findItem({ key: 'dog' });
+
+    expect(lightItem).toBe(container.querySelectorAll('li')[0]);
+    expect(catItem).toBe(container.querySelectorAll('li')[1]);
+    expect(nonExistentItem).toBe(null);
+  });
 });
 /* eslint-enable */