草庐IT

javascript - 如何为具有列表/详细 View 和分页的应用程序选择 Redux 状态形状?

coder 2023-07-04 原文

假设我的数据库中有许多条目(比如用户)。我还有两条路线,一条用于列表,另一条用于详细信息(您可以在其中编辑条目)。现在我正在为如何处理数据结构而苦恼。

我正在考虑两种方法以及两者的组合。

共享数据集

  • 我导航到 /list ,我所有的用户都是从存储在 redux 存储中的 api 下载的,键为 users , 我还添加了某种 users_offsetusers_limit只呈现列表的一部分
  • 然后我导航到 /detail/<id> ,并存储 currently_selected_user<id>作为 val... 这意味着我将能够通过类似这样的方式获取我的用户数据 users.find(res => res.id === currently_selected_user)
  • 更新也很容易,因为我只处理一个数据集和指向它的详细信息
  • 添加新用户也很容易,同样只需使用相同的用户列表

现在我对这种方法的问题是,当用户列表变得庞大(比如数百万)时,下载可能需要一段时间。而且,当我直接导航到 /detail/<id> 时,我还不会下载我所有的用户,所以为了只获取我需要的数据,我必须先下载整个东西。数百万用户只需编辑一个。

分离数据集

  • 我导航到 /list ,而不是从 api 下载我的所有用户,我只下载了几个,这取决于我的 users_per_pageusers_current_page将设置为,我可能会将数据存储为 users_currently_visible
  • 然后我导航到 /detail/<id> , 商店 currently_selected_user<id>作为 val... 而不是搜索 users_currently_visible我只是从 api 下载用户数据..
  • 关于更新,我不会更新users_currently_visible以任何方式
  • 我也不会添加

我认为这里可能存在的问题是,在访问 /list 时我将不得不这样做,再次从 api 下载数据,因为它可能与数据库中的内容不同步,我也可能不必要地详细下载用户数据,因为它们可能偶然已经在我的 users_currently_visible 中了。

某种科学怪人式的恶作剧

  • 我详细说明,我做的和分离数据集一样,但不是直接从 api 下载用户数据,我首先检查:
    • 我有没有users_currently_visible
    • 如果是这样,他们之间是否有使用我的 ID 的用户? 如果两者都为真,则我将其用作我的用户数据,否则我将调用 api
  • 同样发生在更新时,我检查我的用户是否存在于 users_currently_visible 之间如果是这样,我也更新那个列表,如果不是我什么都不做

这可能行得通,但我真的觉得这不是正确的方法。我可能还需要下载 users_currently_visible 的新列表参观/list ,因为我可能添加了一个新的..

有粉丝最喜欢的方法吗?...我相信每个 redux 用户都一定遇到过同样的事情。

谢谢!

最佳答案

请咨询“real world” example来自 Redux 仓库。
它显示了这个问题的解决方案。

你的状态形状应该是这样的:

{
  entities: {
    users: {
      1: { id: 1, name: 'Dan' },
      42: { id: 42, name: 'Mary' }
    }
  },
  visibleUsers: {
    ids: [1, 42],
    isFetching: false,
    offset: 0
  }
}

请注意,我正在分别存储 entities(ID -> 对象映射)和 visibleUsers(具有分页状态和 ID 的当前可见用户的描述)。

这似乎类似于您的“共享数据集”方法。但是我不认为你列出的缺点是这种方法固有的真正问题。让我们来看看它们。

Now the problem I have with this approach is that when then list of users gets huge(say millions), it might take a while to download

您不需要全部下载!将所有下载的实体合并到 entities 并不意味着您应该查询所有实体。 entities 应该包含到目前为止下载的所有实体——而不是世界上的所有实体。相反,您只会根据分页信息下载当前显示的内容。

when I navigate directly to /detail/, I wouldn't yet have all of my users downloaded, so to get data for just the one, I'm gonna have to download them all. Millions of users just to edit one.

不,您只需要其中一个。响应 Action 将触发,负责 entities 的 reducer 会将 this single entity 合并到现有状态中。仅仅因为 state.entities.users 可能包含多个用户并不意味着您需要下载所有用户。将实体想象成一个不必被填充的缓存。


最后,我将再次引导您前往 “real world” example来自 Redux repo 。它准确地展示了如何为分页信息和实体缓存编写一个 reducer,以及 how to normalize JSON in your API responses with normalizr这样 reducer 就可以很容易地以统一的方式从服务器操作中提取信息。

关于javascript - 如何为具有列表/详细 View 和分页的应用程序选择 Redux 状态形状?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33940015/

有关javascript - 如何为具有列表/详细 View 和分页的应用程序选择 Redux 状态形状?的更多相关文章

  1. ruby - 具有身份验证的私有(private) Ruby Gem 服务器 - 2

    我想安装一个带有一些身份验证的私有(private)Rubygem服务器。我希望能够使用公共(public)Ubuntu服务器托管内部gem。我读到了http://docs.rubygems.org/read/chapter/18.但是那个没有身份验证-如我所见。然后我读到了https://github.com/cwninja/geminabox.但是当我使用基本身份验证(他们在他们的Wiki中有)时,它会提示从我的服务器获取源。所以。如何制作带有身份验证的私有(private)Rubygem服务器?这是不可能的吗?谢谢。编辑:Geminabox问题。我尝试“捆绑”以安装新的gem..

  2. ruby - 将差异补丁应用于字符串/文件 - 2

    对于具有离线功能的智能手机应用程序,我正在为Xml文件创建单向文本同步。我希望我的服务器将增量/差异(例如GNU差异补丁)发送到目标设备。这是计划:Time=0Server:hasversion_1ofXmlfile(~800kiB)Client:hasversion_1ofXmlfile(~800kiB)Time=1Server:hasversion_1andversion_2ofXmlfile(each~800kiB)computesdeltaoftheseversions(=patch)(~10kiB)sendspatchtoClient(~10kiBtransferred)Cl

  3. ruby-on-rails - Rails - 一个 View 中的多个模型 - 2

    我需要从一个View访问多个模型。以前,我的links_controller仅用于提供以不同方式排序的链接资源。现在我想包括一个部分(我假设)显示按分数排序的顶级用户(@users=User.all.sort_by(&:score))我知道我可以将此代码插入每个链接操作并从View访问它,但这似乎不是“ruby方式”,我将需要在不久的将来访问更多模型。这可能会变得很脏,是否有针对这种情况的任何技术?注意事项:我认为我的应用程序正朝着单一格式和动态页面内容的方向发展,本质上是一个典型的网络应用程序。我知道before_filter但考虑到我希望应用程序进入的方向,这似乎很麻烦。最终从任何

  4. ruby-on-rails - 渲染另一个 Controller 的 View - 2

    我想要做的是有2个不同的Controller,client和test_client。客户端Controller已经构建,我想创建一个test_clientController,我可以使用它来玩弄客户端的UI并根据需要进行调整。我主要是想绕过我在客户端中内置的验证及其对加载数据的管理Controller的依赖。所以我希望test_clientController加载示例数据集,然后呈现客户端Controller的索引View,以便我可以调整客户端UI。就是这样。我在test_clients索引方法中试过这个:classTestClientdefindexrender:template=>

  5. ruby-on-rails - Rails 应用程序之间的通信 - 2

    我构建了两个需要相互通信和发送文件的Rails应用程序。例如,一个Rails应用程序会发送请求以查看其他应用程序数据库中的表。然后另一个应用程序将呈现该表的json并将其发回。我还希望一个应用程序将存储在其公共(public)目录中的文本文件发送到另一个应用程序的公共(public)目录。我从来没有做过这样的事情,所以我什至不知道从哪里开始。任何帮助,将不胜感激。谢谢! 最佳答案 无论Rails是什么,几乎所有Web应用程序都有您的要求,大多数现代Web应用程序都需要相互通信。但是有一个小小的理解需要你坚持下去,网站不应直接访问彼此

  6. ruby - 无法运行 Rails 2.x 应用程序 - 2

    我尝试运行2.x应用程序。我使用rvm并为此应用程序设置其他版本的ruby​​:$rvmuseree-1.8.7-head我尝试运行服务器,然后出现很多错误:$script/serverNOTE:Gem.source_indexisdeprecated,useSpecification.Itwillberemovedonorafter2011-11-01.Gem.source_indexcalledfrom/Users/serg/rails_projects_terminal/work_proj/spohelp/config/../vendor/rails/railties/lib/r

  7. ruby - 如何为 emacs 安装 ruby​​-mode - 2

    我刚刚为fedora安装了emacs。我想用emacs编写ruby。为ruby​​提供代码提示、代码完成类型功能所需的工具、扩展是什么? 最佳答案 ruby-mode已经包含在Emacs23之后的版本中。不过,它也可以通过ELPA获得。您可能感兴趣的其他一些事情是集成RVM、feature-mode(Cucumber)、rspec-mode、ruby-electric、inf-ruby、rinari(用于Rails)等。这是我当前用于Ruby开发的Emacs配置:https://github.com/citizen428/emacs

  8. ruby-on-rails - Rails 应用程序中的 Rails : How are you using application_controller. rb 是新手吗? - 2

    刚入门rails,开始慢慢理解。有人可以解释或给我一些关于在application_controller中编码的好处或时间和原因的想法吗?有哪些用例。您如何为Rails应用程序使用应用程序Controller?我不想在那里放太多代码,因为据我了解,每个请求都会调用此Controller。这是真的? 最佳答案 ApplicationController实际上是您应用程序中的每个其他Controller都将从中继承的类(尽管这不是强制性的)。我同意不要用太多代码弄乱它并保持干净整洁的态度,尽管在某些情况下ApplicationContr

  9. ruby - RVM 使用列表[0] - 2

    是否有类似“RVMuse1”或“RVMuselist[0]”之类的内容而不是键入整个版本号。在任何时候,我们都会看到一个可能包含5个或更多ruby的列表,我们可以轻松地键入一个数字而不是X.X.X。这也有助于rvmgemset。 最佳答案 这在RVM2.0中是可能的=>https://docs.google.com/document/d/1xW9GeEpLOWPcddDg_hOPvK4oeLxJmU3Q5FiCNT7nTAc/edit?usp=sharing-知道链接的任何人都可以发表评论

  10. ruby-on-rails - 如何在我的 Rails 应用程序 View 中打印 ruby​​ 变量的内容? - 2

    我是一个Rails初学者,但我想从我的RailsView(html.haml文件)中查看Ruby变量的内容。我试图在ruby​​中打印出变量(认为它会在终端中出现),但没有得到任何结果。有什么建议吗?我知道Rails调试器,但更喜欢使用inspect来打印我的变量。 最佳答案 您可以在View中使用puts方法将信息输出到服务器控制台。您应该能够在View中的任何位置使用Haml执行以下操作:-puts@my_variable.inspect 关于ruby-on-rails-如何在我的R

随机推荐