Question

我正在尝试在Redux表单上加载一些数据，以便可以对其进行编辑。除了redux形式之外，我已经在用Reduce加载它了。所以首先：我不知道这是正确的方法还是redux为此提供了任何种类的API。

由于数据是不可变的，因此无法更改它，如果我尝试更改任何输入上的数据，它将始终将输入恢复为初始值。因此，我想知道如何加载具有初始化值的表单，然后找到一种方法来允许我编辑这些值，以便将它们发送回适当的端点。

这些是输入以及我加载数据的方式：

class PassengerFormModal extends Component {

  componentDidMount() {
    // HERE I LOAD THE DATA THAT WILL BE PRESENT WHEN THE MODAL IS VISIBLE
    const {
      passengerInfo,
      editPassengerDataActionActionHandler,
    } = this.props;

    if (passengerInfo) {
      editPassengerDataActionActionHandler({
        id: passengerInfo.id,
        phone: passengerInfo.phone,
      });
    }
  }

  const phoneField = () => (
    <TextInput
      onFocus={onFocus}
      value={editPassengerData.phone}
      onChangeText={phone => editPassengerDataActionActionHandler({ phone })}
    />
  );
  ...
  <Field name="phone" component={this.phoneField} /> // Redux Form input
  ...
  <TouchableOpacity
    onPress={submitForm}
  >
} 

export default compose(
  reduxForm({ form: 'PassengerFormModal' }),
  connect(
    store => ({
      editPassengerData: store.popupsModals.editPassengerData,
    }),
    dispatch => ({
      editPassengerDataActionActionHandler: data => {
        dispatch(editPassengerDataAction(data));
      },
    }),
  ),
)(PassengerFormModal);

到目前为止，每次隐藏表单并再次显示该表单时，我从prop passengerInfo获得的值就在那里。但是我不能编辑它们。我在TextInput-> onChangeText={phone => editPassengerDataActionActionHandler({ phone })}的onChangeText中有这个动作处理程序，我想将编辑后的值发送给reducer，还是可以用redux形式做到这一点？

我已经在这里停留了一段时间。

如何加载数据以在ReduxForm上进行编辑？

0 个答案: