reactjs 按引用使用状态

insrf1ej 于 2022-12-26 发布在 React

关注(0)|答案(1)|浏览(137)

使用multi-material，我将使用以下行折叠表行

<Collapse in={"open"+row.name} timeout="auto" unmountOnExit>

我有一个使用状态

const [openOne, setOpenOne] = useState(false)

在.map迭代期间，第一个row.name将是One，因此在collpase中，它将创建类似in={openOne}的内容
我的问题是如何将{"open"+row.name}（即{openOne}）引用到useState openOne？

reactjs

来源：https://stackoverflow.com/questions/74889980/byreference-usestate

1条答案

按热度按时间

wgeznvg71#

您应该使用不同的方法。
也许您不应该对每个项使用不同的useState，而应该使用一个保存所有项的值的useState。

const [openRows, setOpenRows] = useState(()=>{
   // replace allRows with the list of rows you have
   allRows.reduce((acc, {name})=>({
     ...acc,
     [name]: false
   }),{});
});

现在您可以使用

<Collapse in={openRows[row.name]} timeout="auto" unmountOnExit>

要设置行，您可以执行以下操作

setOpenRows((currentOpen) => ({
  ...currentOpen,
  'one': true  // or [row.name]: true if you are using it in a dynamic way
}));

赞(0）回复(0）举报 2022-12-26

我来回答

reactjs 按引用使用状态

1条答案

相关问题

热门标签

最新问答