Question

我有一些组件。该组件包含方法＆＃34; componentWillReceiveProps＆＃34;。该方法大致包含逻辑：

componentWillReceiveProps(nextProps) {
    if (this.props.someObject.obj1.prop1 != nextProps.someObject.obj1.prop1
      || this.props.someObject.obj2.prop2 != nextProps.someObject.obj2.prop2) {
      this.props.doAction1(nextProps.someObject);     
    }
    //any code
  }

＆＃34; this.props.doAction1＆＃34; - 是行动。

如果我创建新动作并将此逻辑移动到新动作中，这样可以吗？

例如：

function newAction(current, new){
    if (current.obj1.prop1 != new.obj1.prop1
      || current.obj2.prop2 != new.obj2.prop2) {
      doAction1(new);     
    }
}

并修改componentWillReceiveProps：

componentWillReceiveProps(nextProps) {    
    this.props.newAction(this.props.someObject, nextProps.someObject);
    //any code
  }

Answer 1

因此，如果要将newAction和doAction1作为道具发送到组件，那么您所编写的内容是正确的。从您的代码中，我认为将“newAction”定义为组件的功能可能会更好。只需在组件中定义它并绑定它。它应该被调用为'this.newAction' 您也可以将它绑定到您的组件，如下所示：

newAction = (current, new)=>{
if (current.obj1.prop1 != new.obj1.prop1
  || current.obj2.prop2 != new.obj2.prop2) {
  doAction1(new);     
 }
}

Answer 2

我认为您以错误的方式使用了术语lResult = oJSO.SaveAs(ThisWorkbook.Path & "\" & "Inputs\CAR.txt", "com.adobe.acrobat.plain-text")。行动应该引起减速器的更新。不是组件逻辑，所以它应该是组件的方法，或者只是一个函数，如果你想要的话。
如果你真的是指行动 - 不要在componentWillReceiveProps中使用它（这根本就是错误的模式）。在这种情况下，你冒险获得
- 递归更新app
- 状态逻辑混乱
- 状态不一致
因此，如果您想要激活状态更新（调用减少器），如果某些对象已被更改（通过reducer） - 您最好在reducer中执行此操作（如果该对象在其他reducer中更新 - 您可以使用redux-thunk / redux-saga）。此外，最好只为所有这些更改调用一个操作，以确保状态的一致性。

<强>要点：

行动应该引发国家的原子更新。如果您正在编写许多不了解要更改的其他对象的缩减器 - 使用action或redux-thunk，请为reducers准备数据并仅调用一个应该使用的操作在一些减速器中。

不要将更新状态的逻辑移动到组件中（这与您使用MVC并从View更新模型相同）。

Answer 3

如果doAction1是redux动作创建者，则无法调用它而不用dispatch包装它。直接拨打doAction1(...)会触发您的减速机。

据推测，您已使用mapDispatchToProps接收doAction1作为组件的道具，因此可以这样调用它：this.props.doAction1(...)。也就是说，this.props.doAction1基本上是dispatch包裹的doAction1。

因此，如果我理解的是正确的，你需要这样的东西：

进行比较并将操作作为回调进行操作的方法

// the 'newAction' method
function checkAndDispatch(current, new, callback){
  if (current.obj1.prop1 != new.obj1.prop1
    || current.obj2.prop2 != new.obj2.prop2) {
    callback(new);     
  }
}

并在您的组件内：

componentWillReceiveProps(nextProps) {    
  checkAndDispatch(this.props.someObject, nextProps.someObject, this.props.doAction1);
  // ...
}

需要思考的要点：

在Redux中，动作创建者是return具有type键的对象的函数。 type是目标缩减器。
要触发目标reducer，动作创建者应在调用时用调度包装。

将逻辑移动到新操作中

3 个答案: