在 React 中將登錄更改為注銷

Question

我試圖在用戶登錄時將登錄按鈕更改為注銷。使用當前代碼，該按鈕實際上按預期執行（點擊登錄將顯示要登錄的表單），但該按鈕最終仍然說登錄但它會讓用戶注銷。 這是我的代碼：

 const handleSignOut = () => { push("/"); localStorage.removeItem("token"); }; const [login, setLogin] = useState(false) {login ? ( <Link className="link" to="/" onClick={() => { handleSignOut(); setLogin(false); }} > Logout </Link> ) : ( <Link className="link" to="/"> Login </Link> )}

我已經包含了初始設置為 false 的用於登錄的 handlesignout 和 usestate。

Answer 1

您需要將初始狀態設置為 true；

const [login, setLogin] = useState(true) // 在你的帖子里是假的

這應該有效。

 // login.js const handleSignOut = () => { push("/"); localStorage.removeItem("token"); }; const [login, setLogin] = useState(true) const handleSubmit = () => { setLogin(false); } {login ? ( <Link className="link" to="/"> Login </Link> ) : ( <Link className="link" to="/" onClick={() => { handleSignOut(); setLogin(true); }} > Logout </Link> )} // assuming this is your form // in your Form component on submitting, call this callback "handleSubmit" <Form onSubmit={handleSubmit} />