救救孩子吧！！取消勾选上边下边消失，取消勾选下边上边不消失，怎么改成双向的

Question

/** [onChange 勾选或取消函数] */
  onChange=(e)=>{
    let pridepictData=this.state.pridepictData;
    pridepictData.forEach((item, i) => {
      if(item.optionid==e.target.value){//当前操作的数据
        item.isChecked=e.target.checked;
        item.isCheckeda=e.target.checked;
      }
    });
    this.setState({pridepictData})
  }
  /** [handleChange 获取] */
  handleChange=(value,text)=>{
    if(text=='input'){
      if(value!=' '&&!isNaN(value)){
        this.setState({input:value})
      }
    }else{
      this.setState({unit:value})
    }
  }
 
  /** [getData 过滤复数据 拿到本页面渲染数据] */
  getData=(data)=>{
    let pridepictData=[];
    if(data&&data[0]){
      data.forEach((item)=>{
        let repeat=false;
        if(data&&data[0]){
          pridepictData.forEach((item1)=>{
            if(item1.optionid==item.symid){
              repeat=true
            }
          })
        }
        if(!repeat){//未重复
          let obj={
            moduleid:2,
            optionid:item.symid,
            optionname:item.symname,
            input:'',
            unit:'',
            useflag:'1',
            creator:window.sessionStorage.getItem('userid'),
            updator:window.sessionStorage.getItem('userid'),
            parentids:item.parentids,
            parentid:item.parentid,
            isChecked:true,
          }
          pridepictData.push(obj);
        }
      })
    }
    this.setState({pridepictData})
  }
  /** [onChoice 点击选择框函数] */
  onChoice=()=>{
    let {pridepictData,input,unit}=this.state;
    let {getFieldValue,onChange,setInitData}=this.props;
    let data=[];
    let data1 = [];
    pridepictData.forEach((item)=>{
      console.log("pridepictData",item)
      if(item.isChecked){ //选中的子项
        item.input=input;
        item.unit=unit;
        data.push(item);
      }else{
        item.input=input;
        item.unit=unit;
        data1.push(item);
 
      }
    })
    let pridepictValue=getFieldValue('pridepict');
    if(pridepictValue==''||pridepictValue&&pridepictValue.length==0){//第一次设置值
      onChange(data);
      setInitData({pridepict:data});
    }else{
      let arr=[];//需要添加的数据集合
      pridepictData.forEach((item)=>{
        let repeat=false;
        pridepictValue.forEach((item2)=>{
          if(item.optionid==item2.optionid){//重复  替换相关数据
            item.input=item2.input;
            item.unit=item2.unit;
            repeat=true;
          }
        })
        if(!repeat){//没重复
          arr.push(item);
        }
      })
      arr.forEach((item)=>{pridepictValue.push(item)})
      onChange(pridepictValue)
      setInitData({pridepict:pridepictValue})
    }
    this.setState({pridepictData:data1,input:'',unit:'天'})
  }
  render() {
    let pridepictData=this.state.pridepictData;
    return (
        <Container>
          <LeftBox>已选</LeftBox>
          <RightBox>
          {
            pridepictData&&pridepictData.length>0?
            <SpecRow>
                {
                  pridepictData.map((item)=>{
                      return(
                        <SpecCol span={8} key={item.optionid+item.optionname}>
                          <Checkbox
                              value={item.optionid} checked={item.isChecked}
                                    onChange={this.onChange}>{item.optionname}
                          </Checkbox>
 
                        </SpecCol>
                      )
                  })
                }
            </SpecRow>
            :null
          }
          </RightBox>
          <SpecFooter>
            <div style={{display:'flex'}}>
              <Input style={{ width:100}} value={this.state.input} onChange={(e)=>{this.handleChange(e.target.value,'input')}}/>
              <Select value={this.state.unit} style={{ width: 75 }} onChange={(value)=>{this.handleChange(value,'unit')}}>
                <Option value={"天"}>天</Option>
                <Option value={"周"}>周</Option>
                <Option value={"月"}>月</Option>
                <Option value={"季度"}>季度</Option>
                <Option value={"年"}>年</Option>
              </Select>
            </div>
            <Button type="primary" onClick={this.onChoice}>提交</Button>
          </SpecFooter>
        </Container>
    );
  }
}
 
 
 
 
componentDidMount(){
  };
  /** [changeCheckedValues 已选框改变函数] */
  changeCheckedValues=(data,symptomData)=>{
    let checklistData=[];
    data.forEach((item) => {
      symptomData.forEach((item1, i) => {
        if(item1.symid==item){
          checklistData.push(item1);
        }
        if(item1.symptomOptions&&item1.symptomOptions[0]){
          item1.symptomOptions.forEach((item2) => {
            if(item2.symid==item){
              checklistData.push(item2);
            }
            if(item2.symptomOptions&&item2.symptomOptions[0]){
              item2.symptomOptions.forEach((item3) => {
                if(item3.symid==item){
                  checklistData.push(item3);
                }
              });
 
            }
          });
 
        }
      });
    });
    this.setState({checklistData:checklistData})
  }
  /** [firstSwitchModular 一级模块切换函数] */
  firstSwitchModular=()=>{
    this.setState({ type: type })
  }
  /** [handleClassifyClick tab切换函数] */
  handleClassifyClick = (e) => {
    this.setState({ type: e.key })
  }
 

Answer 1

看看是不是需要这种：https://blog.csdn.net/qq_42415827/article/details/114638179
这个最多只能三级全选/反选，反正思路肯定差不多