开发者社区> 问答> 正文

过滤器状态在React中无法正常工作,应该怎么办?

我的父组件从其子组件检索选中的输入值。所以我有一个函数(handleChecked),它带有两个参数:一个'id'和一个检查状态'isChecked':

const handleChecked = useCallback(({ id, isChecked }) => {

const newCheckedValues = checkedValues.filter(current => current !== id);

setCheckedValues(newCheckedValues);

if (isChecked) {
    newCheckedValues.push(id);
    setCheckedValues(newCheckedValues);
}

}, [checkedValues]); 我的功能应该做什么:

1-从单击的输入中获取ID和已检查状态,2-检查状态中是否存在重复的ID,3-如果存在,将其删除,4-保存状态,5-如果已检查,将ID存储在临时数组中,6-保存新状态。

它能做什么 :

好吧,除了将值添加到新状态之外,上述所有任务都可以。 当我单击新输入时,父“ checkedValues”状态为空,并且从零开始。这意味着作为过滤状态结果创建的临时数组也为空。现在,此函数仅在状态中添加一个id,然后将其替换为新单击的输入。

我需要收集所有的检查值,并在该州将它们存储发送,为一个API后前。

你能帮助我吗 ?我尝试了很多事情并解决了问题,但现在我自己还无法解决...

展开
收起
游客6ozuanhecbixy 2019-11-28 21:35:42 837 0
1 条回答
写回答
取消 提交回答
  • 您要调用setCheckedValues(newCheckedValues);两次,一次通过不带的旧数组id,然后一次通过id内部。状态更新是异步的;您应该先做if ... push,然后再打setCheckedValues(newCheckedValues);

    2019-11-28 21:36:12
    赞同 展开评论 打赏
问答分类:
问答标签:
问答地址:
问答排行榜
最热
最新

相关电子书

更多
利用编译将 Vue 组件转成 React 组件 立即下载
React Native 全量化实践 立即下载
React Native 全量化实践—web 技术打造移动研发新模式 立即下载