如何使用 useState 將許多元素添加到數組中? (How to add many elements to an array with useState?)


問題描述

如何使用 useState 將許多元素添加到數組中? (How to add many elements to an array with useState?)

這就是向項目添加一個元素的方式

const [items, setItems] = useState
setItems([...items, newElm ]);

但是,如果我想向項目添加/連接一組元素怎麼辦。這不起作用

const [items, setItems] = useState
setItems([...items, newArr ]);

我該怎麼做?


參考解法

方法 1:

You have to spread the new array just as the items array.

Remember that the recommended way to merge the new items array with your current state is as follows:

setItems(prevState => ([...prevState, ...newArray]))

In this way you can ensure that prevState will have an updated value.

方法 2:

Spread the elements of the new array into the state

const [items, setItems] = useState setItems([...items, ...newArr ]);

(by Joshua SegalIan VascoAwotide Isaiah McZenith)

參考文件

  1. How to add many elements to an array with useState? (CC BY‑SA 2.5/3.0/4.0)

#use-state #react-hooks #react-native






相關問題

為什麼在使用 useState 時初始加載狀態設置為 true? (Why the initial loading state is set to true while using useState?)

如何在 React 中提取狀態的值 (How to extract value of a state in React)

如何在使用狀態掛鉤更新狀態時覆蓋具有相同鍵的對象 (How can overwrite objects that have the same key in updating State with state hooks)

如何使用 useState 將許多元素添加到數組中? (How to add many elements to an array with useState?)

如何正確附加到在功能組件中作為道具傳遞的字符串數組 (How to properly append to string array that was passed as props in functional component)

useState 在功能上與組件 React 的行為不同 (useState behaves differently in function vs componenet React)

如何在反應鉤子中設置多個值來狀態 (How to set multiple values to state in react hooks)

在 reactJS 中使用 useState 和外部過濾器 (using useState and External Filters in reactJS)

React.js 更改下拉值 (React.js to change dropdown value)

useState 不會立即更新狀態 (useState is not updating state immediately)

使用 useState 時,Reactjs 不會立即更新分配的值 (Reactjs doesn't immediately update the assigned value when useState is used)

如何為 useState 創建動態函數名稱? (How do I create a dynamic function name for useState?)







留言討論