范围栏以redux形式

Question

我有一个范围栏,我从反应滑块创建.我想以redux形式使用它.我的问题是值没有返回.更具体的是,当我对表单求值时,其他字段返回值,而此范围栏返回undefined.我如何以redux形式使用Range？我的代码是

<FormGroup className="col-sm-3 ">
        <Label for="value-slider">VALUE</Label>{' '}
        <Field
          id="value-slider"
          name="value-slider"
          component={Range}
        />
      </FormGroup>

Answer 1

你不能将任何随机组件传递给componentprop.它必须实现redux-form的接口(参见用法),什么Range不实现.简而言之,传递元素必须至少触发事件input.onChange并显示来自input.valueprop的值:

const MyRange = props => (
  <Range value={props.input.value} onChange={props.input.onChange} />
)

然后使用它:

<Field
  id="value-slider"
  name="value-slider"
  component={MyRange}
/>