我是新來的反應，并試圖通過一鍵單擊來改變兩種狀態。最終，當我單擊一個按鈕時，我想隱藏一個組件并取消隱藏另一個組件。
該代碼在更改一種狀態時有效，但在兩種狀態下無效
import React from 'react'
import Buttons from './Buttons'
import SignUp from './SignUp'
import SignIn from './SignIn'
import { useState } from 'react'
const Intro = () => {
const [showButtons, setShowButtons] = useState(true)
const [showSignIn, setShowSignIn] = useState(false)
const showSignInBtn = () => (showSignIn === false) ? setShowSignIn(true)
setShowButtons(false) :
setShowSignIn(false)
const [showSignUp, setShowSignUp] = useState(false)
const showSignUpBtn = () => (showSignUp === false) ? setShowSignUp(true) :
setShowSignUp(false)
return (
<div className='introBox'>
<div className='titleMicroReactor'>
CARDIFF MICROREACTOR
</div>
{showButtons && <Buttons showSignInBtn={showSignInBtn} showSignUpBtn=.
{showSignUpBtn}/>}
{showSignIn && <SignIn />}
{showSignUp && <SignUp/>}
</div>
)
}
export default Intro
showSignIn 函式出問題了，在此先感謝
uj5u.com熱心網友回復：
我認為您不需要像showSignIn and這樣的兩個狀態showSignUp。
只需檢查其中一個，
例如：
{showSignIn ? <SignIn /> : <SignUp />}
If showSignInis true 顯示<SignIn />else 顯示 <SignUp />
uj5u.com熱心網友回復：
否則，您可以使用常規
const showSignInBtn = () => {
if (!showSignIn) {
setShowSignIn(true)
setShowButtons(false)
} else {
setShowSignIn(false)
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/472688.html
標籤：javascript 反应
上一篇：React-Router-dom和useHistory。將新URL推送到歷史記錄并更改URL但頁面不更改
下一篇：react中如何做路由？