首页 > 解决方案 > React 函数组件中的 this 关键字

问题描述

在下面的代码中,我收到一个错误,handleClick is not defined。我尝试使用类似 onClick={this.handleClick} 但它不起作用。如何访问下面给出的 Lik 的 onClick 事件的 handleClick 函数

    const VerifyOTP = ({ UserProfile }) => {
    const [timeLeft, setTimeLeft] = useState();
    const [display, setDisplay] = useState(null);
    const [input, setInput] = useState(null);

    handleClick = () => {
        enableOTPBox(false);
    };

    let displaySendOTPAgain = () => {
        setDisplay(
            <Link href="#">
                <a
                    onClick={handleClick} //Error -Handle click method is not defined
                    style={{
                        color: '#0000EE',
                    }}>
                    Resend OTP Again
                </a>
            </Link>
        );
    };
    
    enableOTPBox = (input) => {
        //code
    };

   
    return (
        <div className="row">            
            <div className="col-sm-3">
                <div className="form-group">
                    {input} {display}
                </div>
            </div>            
        </div>
    );
};

export default VerifyOTP;

标签: javascriptreactjsnext.js

解决方案


您需要handleClick声明const

const handleClick = () => {
    enableOTPBox(false);
};

推荐阅读