当我给它初始值时，输入变为只读

Question

当我将 reactstrap 的 input 字段的值设置为某个值时，它变为 readonly.

    <Col md="6">
      <FormGroup>
        <Label htmlFor="department">Department</Label>
        <Field
          id="department"
          name="department"
          type="text"
          component={InputAdapter}
          initvalue={type?kpi.department:''}
        />
        <FormFeedbackAdapter name="department" />
      </FormGroup>
    </Col>

我正在使用来自 react-final-form 的字段，如上面的代码所示。那么

    const InputAdapter = (
  {
    input,
    meta,
    initvalue,
    invalid = meta => meta.touched && meta.invalid,
    valid = () => false,
    ...rest
  }
) => <Input { ...input } { ...rest } invalid={ invalid(meta) } valid={ valid(meta) } value={initvalue}/>

InputAdapter.propTypes = {
  invalid: PropTypes.func,
  valid:   PropTypes.func,
}

这是 InputAdapter 组件。这里我将值设置为初始值。但在此之后该字段已变为只读。 select 类型输入也存在同样的问题。

Answer 1

您想设置 defaultValue= 而不是 value=。具有值集的输入变为 controlled components，您正在观察的行为。

当我给它初始值时，输入变为只读

Input has become readonly when i give initial value to it

input

reactjs

reactstrap