为什么在将值传递给操作之前改变值会将操作参数值设置为未定义？

Question

我正在使用 React Native 构建应用程序。目前，我在将值传递给动作道具时遇到问题。

我在 TextInput 组件的 onChangeText 方法中有一个表单更新操作调用。更改文本时，我会改变文本并将其传递给更新操作，如下所示：

onChangeText={value => {
   let frequency = value + ' ' + this.state.frequencyTerm; 
   console.log(frequency) // this is not undefined but expected value
   this.props.reminderFormUpdate({prop: 'frequency', frequency});
}

但是，当我检查传递给 reminderFormUpdate 函数的值（简单的 console.log 语句）时，它说该值未定义。我还在将频率值传递给操作之前记录了它，这是正确的值。那么为什么会这样呢？

我发现如果我不改变从 TextInput 收到的值，并将行更改为：

this.props.reminderFormUpdate({prop: 'frequency', value});

动作接收到的值不再是未定义的，但显然它不是我想要将我的频率属性设置为的值。当值在传递给函数之前没有发生变化时，该操作也适用于其他道具，但为什么我不能改变值？

这是我的 reminderFormUpdate 函数（该函数与其他道具一起按预期工作，所以我认为这不是问题所在）：

export const reminderFormUpdate = ({prop, value}) => {
   return {
      type: 'REMINDER_FORM_UPDATE',
      payload: {prop, value},
   };
};

在此先感谢您的帮助:-)

Answer 1

reminderFormUpdate = ({prop, value})

在这个代码块中，"value"代表传递对象的属性。所以 prop 和 value 不仅仅是常规的函数参数。他们是属性个名字。这称为“对象解构”。 more info

所以，这里有什么交易？当您改变值时，您在函数中将其作为 "frequency" 传递。当您在 reminderFormUpdate 中解构传递的对象时，您仍在寻找属性 "value"。但现在是 "frequency".

所以你应该这样做：

this.props.reminderFormUpdate({prop: 'frequency',value: frequency});

或在您的 reminderFormUpdate 函数中更改它：

export const reminderFormUpdate = ({prop, frequency}) => {
   return {
      type: 'REMINDER_FORM_UPDATE',
      payload: {prop, frequency},
   };
};

为什么在将值传递给操作之前改变值会将操作参数值设置为未定义？

Why does mutating a value before passing it to an action set the action parameter value undefined?

react-native

action

onchange

reducers