如何正确更改useState(数组、obj和其他)

Question

我正在学习React，并试图弄清楚如何正确地更改功能组件中的状态。你能告诉我这两种选择之间是否有区别吗？如果有，哪一个更适合在工作中使用？谢谢

const addNewTaskInState = (subtitle: string) => {
setTodoListStateArray((todoListStateArray) => {
const newTask = addNewTask(subtitle);
return [...todoListStateArray, newTask]
})
}
const addNewTaskInState = (subtitle: string) => {
const newTask = addNewTask(subtitle);
setTodoListStateArray([...todoListStateArray, newTask])
}

Answer 1

您可以在此处读取的第一个方法名称updater function基于以前的状态更新状态

你的问题是以下部分的答案：

1. 你能告诉我这两个选项之间是否有区别吗

在大多数情况下，这两种方法之间没有区别

2. 工作中最好使用哪一个

如果您更喜欢一致性而不是稍微更详细的语法，那么如果您设置的状态是从以前的状态计算出来的，那么始终编写更新程序是合理的。如果它是根据其他状态变量的先前状态计算的，则可能需要将它们合并为一个对象并使用reducer。

Answer 2

我认为第二个方法更有效，你可以使用它。如果你想采用另一种方法，看看这个代码

const [state, setState] = useState([])
function SetMyState (obj) {
let auxiliaryArray = [...state]
auxiliaryArray.push(obj) 
setState(auxiliaryArray)
}