为每个应用用户使用多个 redux 存储

Posted

技术标签:

【中文标题】为每个应用用户使用多个 redux 存储【英文标题】:using multiple redux stores one for each app user 【发布时间】:2017-02-24 22:46:15 【问题描述】:

在反应原生应用程序中,我使用的是 redux。目前整个应用程序只有一个商店,我使用 redux-persist 将商店缓存到本地存储。

我的应用程序受用户名和密码保护,您必须创建帐户才能使用它。

现在我想提供一种功能,以便我的用户可以在他的帐户之间切换 - 如果他有多个帐户 - 。这会造成很多麻烦,因为现在每次用户在帐户之间切换时我都必须清除存储和重置状态。

所以我在考虑是否可以使用多个商店,每个用户一个?

例如我的应用状态看起来像


  chat:,
  highscores:,
  gameHistory:,

现在,如果用户有帐户,可以说User1@gmail.com,状态将填充他的数据。并且他的状态会被保存到LocalStorage,

一旦他将帐户切换到User2@gmail.com,现在我必须将应用程序重置为其初始状态,然后以某种方式从 localStorage 加载 User2 状态

我不希望每次用户在帐户之间切换时应用的状态都会丢失。

所以我正在考虑在这种情况下,使用多个 Redux Store 是一个不错的选择,每个用户一个。

以前有没有人设计过供多个用户使用的应用程序? 我们如何在 redux 中做到这一点?

【问题讨论】:

【参考方案1】:

上面的答案可以正常工作,但是由于我使用的是 ImmutableJs,因此很难处理嵌套很深的对象。

所以我最终使用 user_id 命名存储密钥。

所以现在当我切换用户时,我只需使用来自 localStorage 或 AsyncStorage 的特定用户数据刷新整个商店。

我将 rootReducer 包裹在一个简单的 reducer 中来处理这个问题。

function makeRootReducer(rootReducer)
 return function reducer(state, action)
   if(action.type==='SWITCH_USER')
      //LOAD USER DATA..
      const data = JSON.parse(localStorage.getItem("store.user."+action.id)||"");
      return makeInitialData(data); //this just return initialData.
    
    let newState = rootReducer(state, action);
    //simple save state to localStorage if state changed
    if(state !== newState)localStorage.setItem('store.user.'+state.user_id',JSON.stringify(newState);
    return newState;
  


【讨论】:

【参考方案2】:

我认为为每个用户开设一个商店并不是一个好主意。看到这个答案:https://***.com/a/33633850/3794660

为什么不通过用户 id 为 reducer 中的数据命名?像这样的:


  currentUserId: "1",
  chat: "1":  // Chats for user id 1 , "2":  // Chats for user id 2 ,
  highscores: // Same structure as above ,
  gameHistory: // Same structure as above ,

切换用户账号时,只需更新当前状态下的userId即可。

我建议使用选择器来封装从存储中读取数据的逻辑。

获取当前帐户所有聊天记录的简单选择器如下所示:

const getCurrUserId = state => state.currentUserId

const getChats = state => 
   const userId = getCurrUserId(state);
   return state.chat[userId];

然后,您可以在 mapStateToProps 中使用简单的 getChats 选择器将数据传递给您的组件。通过这种方式,您封装了从状态中检索数据的逻辑,并且您的组件不需要知道这些细节,因此您可以根据需要随意更改策略。

【讨论】:

我会更进一步,只需将用户 ID 映射到他们的状态,而不是保持不变。这是一个微小的变化,但对我来说似乎更干净。除了将用户切换回已经加载的用户不需要刷新状态之外,可能没有什么重要的技术原因。 @DaveNewton 你介意详细说明一下吗?不知道我明白你的意思。 将用户的状态保存在他们的 ID 键下。 我明白了,是的,这也是一种方式。使用我的解决方案,为什么在切换用户时需要刷新状态? 哦,我看错了你的状态——对不起。但是 IMO 清洁器将所有内容放在一个 ID 密钥下。

以上是关于为每个应用用户使用多个 redux 存储的主要内容,如果未能解决你的问题,请参考以下文章

React Native - Redux:应用程序中相同状态的多个实例

如何使用 react-redux 存储令牌并在多个 axios 请求中使用它?

Redux store 应该是一个用于每个模块或一个用于由多个 mudule 组成的整个应用程序

combineReducers 破坏 Redux 状态并破坏多个 ImmutableJs 减速器

redux数据流

使用多个中间件时在 redux 存储上正确键入 dispatch