数组在setState之后只更新一次

Question

我在尝试更新setState中的数组时遇到问题。

首先，我在主组件中有一个名为"的数组；myCourses"；，从学生那里获得有关课程的信息。然后，我有一个模态组件，它在单击事件后打开。模态接收"；myCourses"当某些条件为true时，从main进行修改，并且更新数组。

这个问题发生在模态组件中的setStateMyCourses之后，因为卡片只呈现一次，在与同一个赞助人进行了几次意图之后(打开模态，做同样的事情，课程不会在视觉上改变，当第一次意图中删除元素时(。

在这里，我分离了该项目的一些代码。

主要部件：

const [myCourses, setMyCourses] = useState([]);
UseEffect(() => {
...
loadMyCourses(setMyCourses)
...
},[]);
...
{myCourses.map((item) => {Card name = {item.name}}
...

{condition && <ModalComponent myCourses={myCourses} setMyCourses={setMyCourses}/>}

在ModalComponent中，我有以下内容：

...
const myCoursesAux = myCourses
myCoursesAux.splice(index, 1);
setMyCourses([...myCoursesAux]);
...

Answer 1

您永远不应该直接更改状态，而是使用setState的updater函数形式来修改数组而不更改它

setMyCourses(prev => prev.filter((_,i) => i !== index))

Answer 2

很抱歉，再次感谢您的回复。我昨天发现了这个问题。当我调用模态组件时，问题出现在第一种情况下。