问题标签 [redux]

通过 webpack 开发服务器运行我的服务器时，我收到此错误：

我的客户端入口文件如下所示：

一切都在服务器端正确呈现，问题是当我在客户端有这个路由器代码时。看起来路由器正在尝试像服务器大小的路由器一样工作，即使它正在客户端上运行。

我使用的版本是：

根据文档，反应应用程序的状态必须是可序列化的。那上课呢？

假设我有一个 ToDo 应用程序。到目前为止，每个项目都具有诸如等之类的Todo属性。现在我想对不可序列化的对象使用方法。即，它会重命名 todo 并做很多其他的事情。namedateTodo.rename()

据我了解，我可以在某处声明函数，并rename(Todo)通过道具将该函数传递this.props.rename(Todo)给组件。

.rename()我在某处声明有两个问题：1）在哪里？在减速机？would be instance在应用程序周围的减速器中的某个地方很难找到所有方法。2）传递这个函数。真的吗？我应该从所有更高级别的组件手动传递它吗？每次我有更多方法时，都会添加大量样板来传递它？或者总是这样做并希望我对一种类型的对象只有一种重命名方法。不Todo.rename() Task.rename()和Event.rename()

这对我来说似乎很愚蠢。对象应该知道可以对它做什么以及以何种方式。是不是？

我在这里缺少什么？

在我的组件中，我有以下内容：

不调用 unsubscribe 会导致以下错误：

警告：setState(...)：只能更新已安装或正在安装的组件。这通常意味着您在未安装的组件上调用了 setState()。这是一个无操作。

我想知道的是我应该分配unsubscribe给this它还是有更好的地方分配它？

我使用 React 和 Redux 作为我的商店。我也在使用 react-redux 库来集成两者。我的商店包含两组数据：

• 任务 { id，名称，assigneeId }
• 用户 { id, name }

我有一个 TaskListComponent （使用 react-redux）connect-s 到我的商店，使用：

我需要两者，因为列表有一个过滤器允许搜索我的任务名称或用户名 - 我的组件需要“用户感知”。

该组件列出了另一个名为 TaskItemComponent 的组件，它显示任务名称和分配用户的名称。

我正在努力决定解决任务分配用户的最佳方法。

• React 指南告诉我，Item 组件应该将 Task 作为 prop，并在 render 函数中解析 User 本身。但是，这要求组件具有存储感知能力，并且使用 react-redux 库，它似乎并没有被设计为允许组件在不被connect-ed 访问存储的情况下访问它。

• 或者我可以解析列表中的用户并将其与任务一起传递给 Item 组件，例如<TaskItemComponent task={task} assignee={resolveTaskAssignee(task)} />. 这样做的好处是让我的项目保持“哑”，并且意味着我不需要让它监听商店的变化（甚至不需要了解商店）。

任何意见，将不胜感激。

我是 react 和redux的新手。

问题：在 redux中实现“数据源”（类似于 kendo-ui数据源）的最佳方法是什么？

我试图将我所有的小部件数据源存储在一个地方（我创建了数据源缩减器）并将数据源“绑定”到它的小部件（如表格小部件、列表视图、组合框等）。数据源必须有它自己的 api（如 addFilter、addSort、getFiltered 等）并且还存储应用的过滤器和数据。

我想将所有数据源存储在 redux 存储中（这就是为什么我需要在创建小部件之前创建数据源并调度它的创建）。

问题是当我为我的“智能”小部件的容器组件创建 react-redux 连接器时，我需要发送带有道具的数据源，但此时尚未创建数据源。

如果我发送虚拟初始数据源（不发送它的创建和数据填充）然后发送它并在 componentDidMount 上向它填充数据 - 我的小部件的渲染函数调用了两次

我想我需要某种“包装器”功能，但现在我不知道该怎么做。

也许有一些如何实现“数据源功能”的例子？

因此，我尝试使用此示例React-router进行配置，以设置基本应用程序。Redux

当我尝试渲染我的组件时，我收到 1 个错误和 2 个警告。

错误是：Uncaught TypeError: Cannot read property 'toUpperCase' of undefined。

警告 #1：Warning: React.createElement: type should not be null or undefined. It should be a string (for DOM elements) or a ReactClass (for composite components).

警告#2：Warning: Only functions or strings can be mounted as React components.

我刚得到两个简单的组件。一个Root组件和一个Container组件来测试一切是否正常。

根组件的内容：

Container 组件的内容：

以防万一 - 减速器的内容：

将 jspm / system.js 与 Babel 转译器一起使用时，我在控制台中看到以下错误

如果我将该行注释掉react/themes/index.js，我（正如预期的那样）不再看到该错误。

但是，我确实看到了这一点；

这似乎与 DevTools 有关。

这是我尝试使用它们的方式；

这是我的 package.json

如果我设置__DEVTOOLS__ = false，我看不到任何错误，并且应用程序按预期呈现。

我的实现基于这个 webpack 示例，它工作得很好： https ://github.com/emmenko/redux-react-router-async-example

我究竟做错了什么？

我正在构建一个通用/同构的 javascript 应用程序（Express/Redux/React）。我正在考虑使用 React Router 在客户端路由和/或使用 Express 在服务器上路由。

我知道客户端路由已经在单页应用程序中变得流行，因为它们使用户交互更加无缝。

但是，我试图更好地了解客户端与服务器端路由。在构建任何应用程序（单页与否）时，有人可能会遇到客户端路由的潜在缺点是什么？什么时候最好考虑在服务器上进行路由？大型应用程序是仅在一侧（客户端/服务器）路由还是经常将两者混合？

谢谢！

我正在研究Redux生态系统的 TodoMVC 示例。我已经完成了示例的工作代码，现在正在为应用程序的每个元素创建测试。

对于 action 和 reducer，测试非常简单，但对于组件，编写测试证明更具挑战性。

我的通用组件架构如下所示：

为 TodoInput.js 编写单元测试相对简单：

TodoInput.js：

TodoInput-test.js：

但是对于 TodoItem.js，测试有点棘手。

渲染代码根据是否editing在项目上设置了标志进行分支：

TodoItem.js：

我对如何编写测试感到有些困惑，例如，该测试将验证双击组件是否已成功将状态设置为editing: true.

通常，我将测试分为两部分，“渲染”和“事件”，即 TodoItem-test.js：

但在这种情况下，我想看看双击组件是否会导致以下结果：

1. 组件状态现在应该有一个editing与之关联的标志
2. 应该已经改变了element，TodoItem.js现在应该渲染一个<TodoInput/>组件。

针对这种预期行为构建测试的最有效方法是什么？我在想我应该做两件事：

首先，测试看看双击组件是否添加了预期的"editing: true"标志。我不知道该怎么做。如果我按如下方式设置测试：

如何进行测试以确保已设置编辑标志？ liComponent.props.editing返回undefined.

其次，进行context("if the component is editing mode")测试以确保正确呈现以下内容：

我也不确定如何进行严格的测试。