Question

我正在React应用程序中设置Redux表单，该表单具有双重列表框，我无法将值从一个框转移到另一个框，反之亦然。

我正在做复选框的其他事情是，当我触摸/单击页面加载页面时，它不会发布页面值，在两种情况下都是true / false，但默认情况下不是false。

用于双重列表框

    <Field
        name="list"
        type="select"
        onChange={this.handleOnMove}
        component={this.renderReactSelectWrapper}
      />
  renderReactSelectWrapper = props => (
    <DualListBox
      value={props.input.value}
      onChange={props.input.onChange}
      onBlur={props.input.onBlur(props.input.value)}
      options={available}
      selected={selected}
      placeholder="Select"
      simpleValue
      icons={{
        moveLeft: <span key={0}>&lt;</span>,
        moveAllLeft: [<span key={1}>&lt;&lt;</span>],
        moveRight: <span key={2}>&gt;</span>,
        moveAllRight: [<span key={4}>&gt;&gt;</span>],
        moveDown: <span key={5}>&darr;</span>,
        moveUp: <span key={6}>&uarr;</span>
      }}
    />

  );

对于复选框/开关

<Field
                  name="available"
                  id="available"
                  component={this.renderToggleInput}
                />
  renderToggleInput = field => (    <Switch checked={field.input.value} onChange={field.input.onChange} /> );

我需要将值从一个框转移到另一个框，对于复选框/开关，我需要在页面加载时发布。

Answer 1

我正在解决同样的问题。我认为问题是您没有正确更新所选阵列。以下代码对我来说对所选选项有效。

    <DualListBox
      options={options}
      value={this.props.input.value}
      onChange={this.props.input.onChange}
      selected={[...this.props.input.value]}
    />

用双列表框实现Redux表单

1 个答案: