import React, { useEffect, useState } from "react";
import { NavLink, useLocation } from "react-router-dom";
function Navigation() {
const [pageTitle, setPageTitle] = useState("about");
useEffect(() => {
console.log(pageTitle);
}, [pageTitle]);
return (
<div>
<section className="flex justify-center mt-36">
<ul className="flex gap-4">
<NavLink to={"/"}>
<span className="group transition duration-300">
about
<span className="block max-w-0 group-hover:max-w-full transition-all duration-500 h-0.5 bg-sky-600"></span>
</span>
</NavLink>
<NavLink
to={"/portfolio"}
onClick={() => {
setPageTitle("portfolio");
}}
>
<span className="group transition duration-300">
portfolio
<span className="block max-w-0 group-hover:max-w-full transition-all duration-500 h-0.5 bg-sky-600"></span>
</span>
</NavLink>
</ul>
</section>
<section>
<span className="flex-shrink mx-4 text-gray-400">{pageTitle}</span>
</section>
</div>
);
}
當我單擊投資組合時，狀態沒有改變。實際上在第一次單擊后狀態會發生變化。我聽說狀態是異步的，必須使用 useEffect。無論如何，我沒有明白這一點。我在哪里做錯了什么？謝謝。
uj5u.com熱心網友回復：
貼上標簽onClick_<span>
<NavLink
to={"/portfolio"}
>
<span onClick={() => setPageTitle("portfolio")} className="group transition duration-300">
portfolio
<span className="block max-w-0 group-hover:max-w-full transition-all duration-500 h-0.5 bg-sky-600"></span>
</span>
</NavLink>
uj5u.com熱心網友回復：
這將在第一次單擊后更新，因為您正在更新 onClick 事件中的狀態，順便說一句，您希望何時更新您的狀態？并且您的 useEffect 在這里沒有用，它只是在安慰您的 pageTitle 值。
uj5u.com熱心網友回復：
我為這個問題使用了道具并修復了它。
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/517865.html
標籤：反应异步状态
下一篇：如果我對discord.py命令使用幫助功能，我應該使用await來呼叫我的幫助功能還是將控制權轉移給我的異步幫助器