Javascript 在React中使用useRef const-App=（）=>{ 函数hideCharacter（）{ const randomChar=useRef（null）； randomChar.classList.add（'hide'）； } 返回( //错误：未定义 加载另一个 ); };

为什么我的ref没有定义？我需要将代码重构为类？

您正在违反React钩子规则。钩子应该在顶部的功能组件中声明

在您的情况下，您是在本地函数中声明它，而在本地函数之外它是不可用的

它必须是这样的：

const-App=（）=>{
const randomChar=useRef（null）；//您违反了与钩子相关的规则。钩子只能在功能组件内部的顶层使用。请参阅：const有块级范围，请尝试将其移出hideCharacter。请在此处@IvanKomarnytskiy检查
const App = () => {
    function hideCharacter(){
        const randomChar = useRef(null);
        randomChar.classList.add('hide');
    }
    return (
        <> 
            <RandomChar ref={randomChar} /> // error: not defined
            <button class="btn btn-primary" onClick={hideCharacter()}>Load another one</button>
        </>
    );
};