findDOMNode is deprecated in StrictMode

Question

I am using antd and I am seeing this error

findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of DOMWrap which is inside StrictMode. Instead, add a ref directly to the element you want to reference

I have realized that it is because of mode="horizontal". I have tried using other components as well and I see this error a lot in antd. Is there any way to fix this issue? This is my current code

import React from 'react'
import { connect } from 'react-redux';
import { Layout, Menu  } from 'antd';

const { Header, Footer, Content } = Layout;

  const AddForm = () => {
    return (
    <div>
        {/* // Menu Starts from here */}

        <Layout className="layout">
            <Header>
            <div className="logo" />
            <Menu theme="dark" mode="horizontal" defaultSelectedKeys={['2']}>
                <Menu.Item key="1">nav 1</Menu.Item>
                <Menu.Item key="2">nav 2</Menu.Item>
                <Menu.Item key="3">nav 3</Menu.Item>
            </Menu>
            </Header>
            <Content style={{ padding: '0 50px' }}>
            <div className="site-layout-content">Content</div>
            </Content>
            <Footer style={{ textAlign: 'center' }}>Ant Design ©2018 Created by Ant UED</Footer>
        </Layout>
    </div>
    )

  };

Answer 1

I'm fixing it by wrapping the commponent using <React.StrictMode>

in my case, the the button inside the form caused that error, so I solve it by

<React.StrictMode>
    <Button type="primary" htmlType="submit" className="submit">
        Register
    </Button>
</React.StrictMode>