[英]Immutable Update React Hooks Array Object
我用钩子成功地改变了菜单状态,但是......
const [menu, setMenu] = useState([
{
parent: 'User',
permission: false,
children:[
{name: 'Vendor', permission: false, readonly: true},
{name: 'Client', permission: false, readonly: true},
{name: 'User', permission: false, readonly: true},
]
}
]);
const toggleParent = (key) => {
let data = {...menu};
data[key].permission = !data[key].permission
setMenu(data);
};
最终在映射函数中出错,它说:
menu.map 不是函数
这是映射函数:
{menu.map((value, key) => (
<Switch
checked={value.permission}
onChange={() => toggleParent(key)}
color="primary"
name="checkedB"
inputProps={{ 'aria-label': 'primary checkbox' }}
/>
))}
我认为问题来自{...menu}
。 通常当您调用.map()
而不是在数组上时会发生此错误。 你需要一个[]
来代替。
请尝试以下操作:
const toggleParent = (key) => {
let data = [...menu];
data[key].permission = !data[key].permission;
setMenu(data);
};
我希望这有帮助!
您的代码存在问题,您的菜单是一个数组,您正在为其分配一个对象并在其上使用地图。
这是执行此操作的正确方法。
const toggleParent = (key) => {
let data = [...menu];
data[key].permission = !data[key].permission
setMenu(data);
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.