这种比较似乎是无意的，因为类型 '{loading: Boolean; }' 和 'boolean' 没有重叠

Question

我正在尝试使用 Typescript 为我的应用程序设置加载状态。

   const [loading,loadingupdate] = useState<Boolean>(false)

 
      return ( 
        {
                loading === true ? <></> : <>
                <div className={` ${skin} bigcontainer`}>
                    <div className="main-consign">
                        <h1 className="labelauth">{label}</h1>

                    <Meat label={label} model={model} passworderror={passworderror} emailerror={emailerror} usernameerror={usernameerror} username={usernameupdate} password={passwordupdate} email={emailupdate}/>

                        <button className="submitsign" onClick={()=>{loadingupdate(!loading),submit()}}>Submit</button>

                    <div className="linksign" onClick={()=>{label === authlabels.login ? navagate('/Signup') : navagate('/Login')}}>{label === authlabels.signup ? 'Aready SignedUP?' : 'No account?'}</div>
                    </div>
                </div>
            </>
        }
    );

我希望我的代码在等于 false 时不显示任何内容。当我在渲染中按下注册按钮时，它将获取数据，当获取响应时，它将在响应后更改布尔值，因此它不会总是等于 false。

像这样：

      async function submit(){
        if(label === authlabels.login){
            console.log(`This is password: ${password} \n This is username: ${username}`)

        }else{
            console.log(`This is email: ${email} \n This is password: ${password} \n This is username: ${username}`)

             
            
            const body:any = {
                email: email,
                password: password,
                username: username
            }

            const options: any = optionsMaker(body)

            await fetch('http://localhost:5000/signUp',options).then(response=>{
                //console.log(response)// this is response from server, including all ok and error responses 
                if(response.ok)
                    setTimeout(()=>{
                        loadingupdate(!loading)
                    },2000)
                else{
                    setTimeout(()=>{
                        console.log(`hi ${loading}`)
                        loadingupdate(!loading)
                    },2000)

                    response.json().then((response)=>{console.log(response)}) 

                }
            })

            
        }
      }
      

它还给出了错误，即我的状态将始终等于 false，但在获取打字稿错误后它会发生变化。

Answer 1

好吧，您需要将您的状态声明为boolean（原始类型，小写）。