0

我有多页表单，如果返回，我想设置选中的字段，我想出了如何做到这一点，但它没有按我预期的那样工作。

我找到需要检查的元素，分配属性，但 UI 上没有任何反应，Chrome devtools 中有已检查的属性

这是代码：

 if (Object.keys(this.props.data).length > 0) {
      const elements = this.formRef.current.elements;
      const IDs = ['1', '2', '3', '4', '5', '6']
      IDs.map(id => {
        if (elements[id]) {
          if (Array.from(elements[id]).length > 1) {
            let radio = Array.from(elements[id]).find(el => el.value == this.props.data.subData[id])
             let r = ReactDOM.findDOMNode(radio);
             r.checked = true;
          } else {
            if (id === 1) {
              this.setState({
                dropdownValue: this.props.data.subData[id]
              })
            }
            let r = ReactDOM.findDOMNode(elements[id]);
             r.value = this.props.data.subData[id]
          }
        }
      })
    }
  }

这是一个组件：

 <Radio
     label='...'
     desc='...'
     id='...'
     name='...'
     options={[
          { id: '...', label: '...', value: '...', name: '...' },
          { id: '...', label: '...', value: '...', name: '...' }]}
 />

这将返回：

<div className='form-input-group'>
        <label>{label} <span>{desc}</span></label>
        {options.map((option, index) => (
          <RadioItem
            key={index}
            option={option}
            defaultValue={this.state.value}
            onChange={this.handleChange}
          />
        ))}
      </div>
4

0 回答 0