Question

我有一个FieldArray组件应该显示电话。用户可以添加包含号码字段，类型字段和按钮的电话对象，以将电话添加到电话列表（FieldArray）。

电话列表组件包含一个按钮，其中包含函数fields.remove（index），我将电话索引传递给。

我的手机对象是： {number：number，type：type}

目前正在使用： React 0.15.3，Redux-Form 6.0.0-rc3，Material-UI 0.15.3

电话字段声明：

<Field name="phoneNumber" component={renderMaskedTextField} label={"Telefone"} type="text" mask="(99) 9999-99999"/>

<Field name="phoneType" component={renderSelectField} label="Tipo">
      {PHONE_TYPES.map((option, index) => {
        return <MenuItem value={option.value} primaryText={option.label} key={index}/>;
      })}
</Field>

用于将手机组件添加到列表中的代码：

<IconButton onClick={() => handleAddClick({number: field.input.phone.number, type: field.input.phone.type})} style={styles.addButton}>
   <Add color="#fd084a"/>
</IconButton>

我需要一种方法来获取两个Field值并将其传递给我的 handleAddClick（）

添加功能：

const handleAddClick = (phone) => {
   fields.push(phone);
};

也开放新方法来解决这个问题：D

Answer 1

您可以使用arrayPush() action creator。然后，您需要弄清楚的是如何获取dispatch或预先绑定mapDispatchToProps中的动作创建者。

import { arrayPush } from 'redux-form'

@connect(
  mapStateToProps,
  { arrayPush }
)
class MyForm extends Component {

  ...

  handleAddClick(phone) {
    this.props.arrayPush('myForm', 'phones', phone)
  }

  ...
}

这有帮助吗？

如何使用Push事件获取Field值并将其传递给FieldArray值？ Redux-Form V6-RC3

1 个答案: