Question

我最近很困惑。
当我编写redux时，如果我必须调用api，我会动作更新reducer，该组件只是从props中渲染数据

但是最近我看到我的同事只是在容器组件中调用api然后更新组件状态他说，如果你的数据不需要与其他组件共享，你可以在组件中调用api，这样你就不必在动作和缩减器中编写这么多代码。

我觉得这很方便。例如：如果我有一个功能：当用户点击按钮时，我必须发送一封电子邮件此功能不需要通过reducer更新存储，只需要提醒＆＃34;发送成功＆＃34;

所以我可以在容器组件中编写这段代码：

async onClick() {
  // 1. call api
  const {error, response} = await sendMail({email: this.state.email});
  if (response){    
    // 2. alert success
    this.setState({
      modal: {
        show: true,
      }
    });
  }
}

但我不知道这是否符合redux的原则如果状态不需要与其他组件共享，我可以直接在组件中调用api吗？

Answer 1

您可以从调度的操作或React组件调用api：它是您的选择。这里没有强制性规则，这取决于您对组件的要求：

何时使用React状态：

最好让智能组件处理自己的状态，因为它可以简化外部项目的集成。拥有使用Redux的组件意味着项目需要添加需要的reducers才能使用该组件。
如果组件处理任何其他组件不需要的信息，请使用React状态。对于与UI状态相关的信息，通常就是这种情况。

使用Redux时减少：

如果您需要测试组件，请选择Redux，因为在测试组件时，您可以将“测试操作”连接到组件。
如果您需要通过组件共享数据包，请使用Redux来共享信息。

如果你想看看，Gaeron已经Redux github repository对这个问题进行了处理。他解释说：

将React用于与全局应用无关的短暂状态，并且不会以复杂的方式进行变异。例如，某个UI元素中的切换，表单输入状态。将Redux用于全局重要或以复杂方式变异的状态。例如，缓存用户或帖子草稿。有时你会想要从Redux状态转移到React状态（当在Redux中存储某些东西变得笨拙时）或者反之（当更多组件需要访问某些曾经是本地的状态时）。经验法则是：做任何不那么尴尬的事情。

Answer 2

我建议您查看classux

当使用redux时，我可以在容器组件中调用api吗？

2 个答案: