时间戳

首页 > 解决方案 > 从服务访问商店（或者我应该在哪里访问商店）？

react-redux - 从服务访问商店（或者我应该在哪里访问商店）？

问题描述

我才几天（从 Ember 过渡）所以请原谅我的无知。

我的商店中有一组对象（profileaccounts）。我有许多不同的组件连接到商店并具有如下代码，有时用户是登录的人，有时是被传递到组件中的用户（当有人查看其他人的个人资料时）

componentDidMount() {
    let user = this.props.user;
    let account = this.props.profiles.find(function (prof) { return prof.profile.id === user.id });
    if (account == null) {
        this.props.dispatch(userActions.getProfile(user.id));
    }
}

这完全有效，但我不想一遍又一遍地复制这段代码。我的直觉是，我应该始终调用.getProfile(user.id)它来确定数据是否存在于本地缓存（存储）中，或者是否需要添加。如果需要添加，添加它，然后以任何方式返回它。或者，也许用户服务（代表 API 并由操作调用以填充配置文件）应该在调用 API 之前在本地查看。无论如何，我不知道如何（或者我是否应该）从操作或服务访问商店，仅从连接的组件。

在我读过的任何关于 redux/react 的指南中，我都没有看到这种情况，所以如果有人能在我应该寻找的地方提供资源，我将不胜感激。如果我完全走错了路，我也很高兴知道这一点。

标签： react-redux

解决方案

您可以使用 redux-thunk 访问 thunk 的操作链接中的状态：https ://github.com/reduxjs/redux-thunk

代码将是这样的：

function incrementIfOdd() {
  return (dispatch, getState) => {
    const { counter } = getState();

    if (counter % 2 === 0) {
      return;
    }

    dispatch(increment());
  };
}

使用 thunk 您将能够访问操作中的状态。

你的方法听起来不错......你将从调度一个动作“dispatch（getProfile（userId））”开始，然后在动作中你会做任何你想做的事情，当你最终有了你想要放入商店调度的数据时另一个动作“dispatch（storeUserProfile（profile））”将通过reducer将数据放入存储中。

推荐阅读