Javascript ReactJS：状态在嵌套函数内不起作用

因此，我try 使用setTagList()修改标记列表.它更改了页面内容(它在&lt；Filter/&gt；组件中添加了标记)，但我无法实现&lt；Filter/&gt；中的每个标记都是唯一的.

import Filter from "./components/Filter";
import Card from "./components/Card";
import data from "./assets/data.json";
import { useState, useEffect } from "react"


export default function App() { 
  const [cards, setCards] = useState([]);
  const [tagList, setTagList] = useState([]);
  

  useEffect(() => {
    generateCards();
  }, []);

  function addTag(newTag) {
    // console.log(tagList) always outputs []

    if (!tagList.includes(newTag)) {
      setTagList(oldTagList => [...oldTagList, newTag])
      // console.log(tagList) here always outputs []
      // But if I change "const [tagList, setTagList] = useState([]);" to "let [tagList, setTagList] = useState([]);" and add "tagList = [...tagList, newTag]" here, it works
    }  
  }  

  function deleteTag(tag) {
    setTagList((oldTags) => oldTags.filter((oldTag) => oldTag !== tag));
  }

  function clearTags() {
    setTagList([]);
  }

  function generateCards() {
    setCards(
      data.map((cardData) => (
        <Card
          key={cardData.id}
          logo={cardData.logo}
          company={cardData.company}
          isNew={cardData.new}
          isFeatured={cardData.featured}
          position={cardData.position}
          postedAt={cardData.postedAt}
          contract={cardData.contract}
          location={cardData.location}
          tags={[
            cardData.role,
            cardData.level,
            ...cardData.languages,
            ...cardData.tools,
          ]}
          addTag={addTag}
          filter={filter}
        />
      ))
    );
  }

  // console.log(tagList) works normally

  return (
    <div className="bg-bg-color h-screen">
      <div className="relative bg-wave-pattern w-full h-28 text-bg-color bg-primary">
        {tagList.length !== 0 && (
          <Filter tagList={tagList} deleteTag={deleteTag} clearTags={clearTags} />
        )}
      </div>
      <div className="2xl:px-96 xl:px-64 lg:px-32 md:px-16 sm:px-4 py-16 space-y-8">{cards}</div>
    </div>
  );
}

我试图在addTag()函数中整合.log(Taglist)，但它总是返回缺省值.但当console.log(Taglist)在函数之外时，它会正常工作. 但是，当我在设置状态时将const关键字更改为let，并在setTagList(...)之后添加"Taglist=[...Taglist，newTag]"时，它起作用了. react 是不是坏了？