我一直在尝试更新DOM上的initUsers
值,以便初始状态值正常工作,但当我更新initUsers
时,它呈现的值与预期值不同。
基本上,entriesNum
会得到一个数字作为事件,并根据它更改initUsers
状态值的顺序,如下所示:
enter image j here
更改为:
enter image description here
第一个
因为我有两种形式的initUsers
,所以我必须设置两种解构方式,如下所示:
{isNewObj ?
initUsers.map((objUser ) => (
< >
{Object.keys(objUser).map((numo) => (
<div
key={numo}
className="contacts-info border-solid border-2 border-black table-row w-full "
>
<input type={"checkbox"} className={`${shortcut}`} />
<div className={`${shortcut}`}>
{objUser[numo].index}
</div>
<div className={`${shortcut}`}>
{objUser[numo].email}
</div>
<div className={`${shortcut}`}>
{objUser[numo].access}
</div>
</div>
))}
</ >
)) :
initUsers.map(({ index, handle, phone, email, access }) => (
<div
key={id}
className="contacts-info border-solid border-2 border-black table-row w-full "
>
<input type={"checkbox"} className={`${shortcut}`} />
<div className={`${shortcut}`}>{index}</div>
<div className={`${shortcut}`}>{handle}</div>
<div className={`${shortcut}`}>{phone}</div>
<div className={`${shortcut}`}>{email}</div>
<div className={`${shortcut}`}>{access}</div>
</div>
))
}
第二个条件在initUsers
未嵌套时析构它,并显示以下结果:
enter image description here
第一个将其解构为嵌套形式,并显示以下结果:
enter image description here
因此,解构嵌套initUsers的结果不是5行,而是9行。
1条答案
按热度按时间0mkxixxg1#
你不能用这种方式更新状态Newobj.push不能处理ReactJs状态。你可以用setNewobj(你的新数据)
setNewobj((prev)=〉[... prev,{}])这里的prev是旧的数据。