使用 setState 钩子修改数组 [重复]
Posted
技术标签:
【中文标题】使用 setState 钩子修改数组 [重复]【英文标题】:Modify an array with setState hook [duplicate] 【发布时间】:2020-12-07 18:20:38 【问题描述】:我有一个 JSON 数组:
function createData(nom, age, poids, )
return
nom,
age,
poids,
;
const [count, setCount] = useState([
]);
setCount(count=>count.concat(createData("mathieu",15)))
setCount(count=>count.concat(createData("jean",25)))
setCount(count=>count.concat(createData("ginette",55)))
setCount(count=>count[0].poids=13) // doesn't work
当 nom= mathieu 但不起作用时,我正在尝试在现有 json 数组中添加 poids=13。 你能帮我吗,我是反应钩子的新手。 谢谢
【问题讨论】:
你能澄清一下“不起作用”吗?这可能意味着任何事情。你得到一个错误?意外的输出? 【参考方案1】:您的setCount()
回调应该返回状态的新值。 count[0].poids = 13
将返回 13
。您还应该not modify state directly,虽然您使用setState
,但您正在检索以前的状态并尝试直接更新它。
相反,您可以使用.map()
返回一个新的对象数组,这将是您的新状态。在.map()
回调中,您可以指定每个对象如何“转换”/更改。如果nom
是“mathieu”,您可以返回一个新转换的对象,否则,您可以简单地返回当前对象。
setCount(count => count.map(
obj => obj.nom === "mathieu" ? ...obj, poids: 13 : obj
));
【讨论】:
只加一个参数更通用,(count,name),obj.nom === name
...以上是关于使用 setState 钩子修改数组 [重复]的主要内容,如果未能解决你的问题,请参考以下文章
在对数组进行排序并传递它之后,React 钩子 useState/setState 不起作用
如何使用我的反应应用程序中的 useState 钩子给出的 setState 方法增加状态对象的选定索引的计数
如何在useEffect(func,[])中使用异步api调用中的setState钩子测试组件