如何在不删除react index.js文件中的严格模式的情况下解决严格模式警告

问题描述

当我以下面的形式使用<Button />时会说

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

即使我使用过useRef,它仍然显示此警告。所以我可以解决它而不删除索引文件中的

import React,{useRef} from 'react'
import { Button,Container,Form,Input } from 'semantic-ui-react'
import Layout from '../layout/Layout'

const Login = () => {

    let btn = useRef(null)
    React.useEffect(() => {
        console.log(btn);
    })

    return (
        <Layout>
            <Container className="auth-form segment">
                <Form>
                    <Form.Field 
                        label="Email"
                        control={Input}
                        placeholder="example@gmail.com"
                        name="email"
                    />
                    <Form.Field 
                        label="Password"
                        control={Input}
                        placeholder="Password"
                        name="password"
                        type="password"
                    />
                    <Button content="Login" ref={btn} primary/>
                </Form>
            </Container>
        </Layout>
    )
}

export default Login

解决方法

我认为您无法做到。

相反,为什么不做类似的事情(在index.js文件中):

if (process.env.NODE_ENV === 'development') {
   return <React.StrictMode><App /></React.StrictMode>;
}
else
{
   return <App />;
}

您可以根据需要使用其他标志... 只是一个主意。