Javascript 在useEffect中更改数组值

我对javascript/React还不到5个月，所以犯了很多错误，我想实现的是

当用户单击一个按钮时，国家/地区值将发生变化，我想这样做

if (country === "Singapore") {   setTeams(sg.items)  } else {   setTeams(my.items) }

但我无法在UseEffectHook中实现它，或者我的方法是错误的

  const [country, setCountry] = useState("Singapore")

  const sg = data.sgteamlist
  const my = data.myteamlist

  useEffect(() => {
    setTeams(sg.items)
  }, [])

  const [teams, setTeams] = useState([])
  const [currentPage, setCurrentPage] = useState(1)
  const [teamsPerPage] = useState(5)

  // Get current teams
  const indexOfLastTeam = currentPage * teamsPerPage
  const indexOfFirstTeam = indexOfLastTeam - teamsPerPage
  const currentTeams = teams.slice(indexOfFirstTeam, indexOfLastTeam)
  const paginate = pageNumber => setCurrentPage(pageNumber)

  return (
    <Layout>
      <Box px="7.5%" color="white.50" pb="20rem">
        <SEO title="About" />
        <Helmet bodyAttributes={{ class: "about-page" }} />
        <TeamGrid teams={currentTeams} />
        <ButtonToggler onClick={() => setCountry("Singapore")}>
          Singapore
        </ButtonToggler>
        <ButtonToggler onClick={() => setCountry("Malaysia")}>
          Malaysia
        </ButtonToggler>
        <Pagination
          teamsPerPage={teamsPerPage}
          totalTeams={teams.length}
          paginate={paginate}
        />
      </Box>
    </Layout>
  )
}

export default AboutPage

const[country，setCountry]=useState（“新加坡”）
const sg=data.sgteamlist
const my=data.myteamlist
useffect（（）=>{
SETTAMS（sg.项目）
}, [])
const[teams，setTeams]=useState（[]）
常量[currentPage，setCurrentPage]=使用状态（1）
const[teamsPerPage]=useState（5）
//获取当前团队
const indexOfLastTeam=currentPage*teamsPerPage
const indexOfFirstTeam=indexoflasteam-teamspage
const currentTeams=teams.slice（indexOfFirstTeam，indexOfLastTeam）
const paginate=pageNumber=>setCurrentPage（pageNumber）
返回(
setCountry（“新加坡”）}>
新加坡
setCountry（“马来西亚”）}>
马来西亚
)
}
导出默认值约页

---

我想根据国家/地区的值更改setTeams数组。

添加

国家/地区

，作为对您的影响的依赖项。基于浅层检查，每次变量不同时，依赖项数组都会运行效果

此外，还应在定义状态变量

teams

之后移动useEffect

const [teams, setTeams] = useState(sg.items);

useEffect(() => {
  if(country === 'Singapore') {
    setTeams(sg.items)
  } else {
    setTeams(my.items)
  },
}, [country])

---

天啊！这是工作。。。谢谢你，先生！！已经困扰了我几个小时了..你必须先定义state和settams，然后才能有效地使用它。将useEffect向下移动，以便在创建所有状态后调用它。