From c9c44e4e8875e11ba73fe908b38971c3e319881c Mon Sep 17 00:00:00 2001
From: glenlivet <kikyou1986@hotmail.com>
Date: Wed, 7 Oct 2020 19:20:38 +0800
Subject: [PATCH] Fixed #1610 - Menubar: findDOMNode is deprecated in
 StrictMode.

---
 src/components/menubar/Menubar.js    |  3 +--
 src/components/menubar/MenubarSub.js | 10 +++++++++-
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/components/menubar/Menubar.js b/src/components/menubar/Menubar.js
index 0f4081ad66..311c1b5aff 100644
--- a/src/components/menubar/Menubar.js
+++ b/src/components/menubar/Menubar.js
@@ -1,5 +1,4 @@
 import React, {Component} from 'react';
-import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import {MenubarSub} from './MenubarSub';
@@ -137,7 +136,7 @@ export class Menubar extends Component {
             <div id={this.props.id} className={className} style={this.props.style}>
                 {start}
                 {menuButton}
-                <MenubarSub ref={(el) => this.rootmenu = ReactDOM.findDOMNode(el)} model={this.props.model} root mobileActive={this.state.mobileActive} onLeafClick={this.onLeafClick} />
+                <MenubarSub forwardRef={(el) => this.rootmenu = el} model={this.props.model} root mobileActive={this.state.mobileActive} onLeafClick={this.onLeafClick} />
                 {end}
             </div>
         );
diff --git a/src/components/menubar/MenubarSub.js b/src/components/menubar/MenubarSub.js
index db18f7eee3..4cd74e1271 100644
--- a/src/components/menubar/MenubarSub.js
+++ b/src/components/menubar/MenubarSub.js
@@ -34,10 +34,18 @@ export class MenubarSub extends Component {
             activeItem: null
         };
 
+        this.createUlRef = this.createUlRef.bind(this);
         this.onLeafClick = this.onLeafClick.bind(this);
         this.onChildItemKeyDown = this.onChildItemKeyDown.bind(this);
     }
 
+    createUlRef(element) {
+        this.element = element;
+        if (!!this.props.forwardRef) {
+            this.props.forwardRef(element);
+        }
+    }
+
     onItemMouseEnter(event, item) {
         if (item.disabled || this.props.mobileActive) {
             event.preventDefault();
@@ -339,7 +347,7 @@ export class MenubarSub extends Component {
         const submenu = this.renderMenu();
 
         return (
-            <ul ref={el => this.element = el} className={className} role={this.props.root ? 'menubar' : 'menu'}>
+            <ul ref={this.createUlRef} className={className} role={this.props.root ? 'menubar' : 'menu'}>
                 {submenu}
             </ul>
         );