Question

我收到此错误在路径中检测到状态突变

我在componentWillReceiveProps中使用了setState：

this.setState({ checkboxes: nextProps.data.my_details});

在渲染功能中，我已生成动态复选框，并根据我正在显示的值显示复选框是否已选中。见下面的代码：

renderSubCategory(data, indexParent){
  let indexParent1 = indexParent;
  const {checkboxes} = this.state;
  return checkboxes[indexParent1].sub_categories.map((data1, index1) => {
    return(
        <View key={index1}>
            <View style={{ flex: 1, flexDirection: 'column' }}>
                    <CheckBox
                        label={data1.name}
                        labelStyle={{fontSize:14}}
                        size={25}
                        color='#17bb8f'
                        checked={data1.status_code === 0 ? false : true}
                        onPress={(checked)=>this.handlePressCheckedBox(index1, checked, indexParent1)}
                    />
            </View>
       </View>
     )
   })
}

现在on_ress函数的复选框我正在改变复选框的状态并获得突变错误。

handlePressCheckedBox = (index,checked, indexParent1) => {
    const {checkboxes} = this.state;
    if(checkboxes[indexParent1].sub_categories[index].status_code === 0){
      checkboxes[indexParent1].sub_categories[index].status_code = 1;
    }else{
      checkboxes[indexParent1].sub_categories[index].status_code = 0;
    }
    this.setState({
        checkboxes
    });
 }

请帮助我解决此问题。

Answer 1

我认为问题来自这部分代码：

const {checkboxes} = this.state;
if(checkboxes[indexParent1].sub_categories[index].status_code === 0){
   checkboxes[indexParent1].sub_categories[index].status_code = 1;
}else{
   checkboxes[indexParent1].sub_categories[index].status_code = 0;
}

做这样的事情：

const {checkboxes} = this.state;

类似于：

const checkboxes = this.state.checkboxes;

之后，当您更改status_code时，您手动更改状态而不是使用setState（引用已更改）。

<强>解决方案：使用扩展迭代器传递州的副本而不是状态引用

const checkboxes = {...this.state.checkboxes};

Answer 2

checkboxes函数正在改变您的handlePressCheckedBox州。

具体来说，这些行是罪魁祸首： checkboxes[indexParent1].sub_categories[index].status_code = 1; checkboxes[indexParent1].sub_categories[index].status_code = 0;

未捕获的错误：在React Native中的调度之间检测到状态突变

2 个答案: