如何解决不能在对象字面量中使用像 .includes 这样的数组函数
我试图在由数组组成的对象文字中组织我的反应状态。
const [state,setState] = React.useState({ filter: [],other: [] });
我想在点击列表项时更新我的过滤器数组。
const handleListItemClick = (event,index) => {
if (state['filter'].includes(index)) {
setState(state['filter'].filter(function (element) {
return element != index;
}))
} else {
setState(state['filter'].concat([index]));
}
};
但是每当我尝试访问过滤器数组时,java 脚本都无法解析包含或 indexOf 之类的数组函数,例如:
<ListItem
button
selected={state['filter'].includes(0)}
onClick={(event) => handleListItemClick(event,0)}>
<ListItemText primary="Kundensegmente" />
</ListItem
我收到此错误:
未捕获的类型错误:state.filter.includes 不是函数
使用 include 之类的函数似乎可以在一维数组中使用。
解决方法
状态的原始形状是这样的:
{ filter: [],other: [] }
但后来你改变了它:
setState(state['filter'].concat([index]));
您用值 fiter
(一个空数组)替换了 whole 状态,该值与新数组 [index]
相连。
那个新数组没有 filter
属性。
对 filter
和 other
使用不同的状态。
const [filter,setFilter] = React.useState([]);
const [other,setOther] = React.useState([]);
或者,如果您真的希望将它们合并为一个对象,那么您需要在状态中保持该对象的形状。
创建一个与旧对象相同的新对象,除了只是要更改的位。
setState({
...state,filter: state.filter.concat([index]);
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。