问题标签 [cyclejs]

可运行示例： https ://esnextb.in/?gist=978799bf48a7f914cbbd39df0213d672

我正在尝试为 cycle.js 创建一个多选组件，以查看是否要使用循环应用程序替换应用程序的当前 UI。

我有一个组件用于多选中的选项。每个选项都以 {selected: Bool, label: String, value: Int} 的形式传递道具

这是代码的概述：

Option 组件侦听自身的点击，并通过在传递给 props$ 源中的选项的初始布尔值上合并逻辑“非”函数生成的布尔值流来切换“选定”布尔值。

Option 组件然后输出它的状态流，以便 Multiselect 组件可以引用它，以便返回选定值的流等。

Multiselect 组件接收一个 props$ 源，其中包含一个带有选项 [{selected, label, value}...] 的流。

从这些选项中，它构造了一个选项组件的数组流。

然后将选项组件流展平为虚拟 dom 树数组流（每个选项一个）。

Option 组件流也被扁平化为状态数组流（每个选项一个）。

这是问题开始的地方：

如果我对它们调用 .observe(console.log) ，上述两者都只记录一次。

为了显示多选，我然后映射选项的虚拟 dom 树数组流以生成多选的虚拟 dom 树。

我还将这个 vtree 流与状态流结合起来，这样我就可以同时使用 console.log 了（因为 observe 只记录一次）。

当我记录它们时，vtree 数组确实发生了变化，但所有选项的状态始终与其初始状态相同。

This only happens if the options are isolated. 如果它们不是孤立的，它们都会响应对其中任何一个的点击，但它们的状态被记录为已更改。

这里发生了什么？为什么隔离很重要？因为所有组合流不会每次都触发？我正在做的事情完全不是惯用的吗？

http://pastebin.com/RNWvL4nf这里也是一个pastebin。我想把它放在 webpackbin 上，但它不会下载我需要的包。

编辑：franciscotln 好心地做了一个工作示例，它揭示了我的一些东西。 https://gist.github.com/franciscotln/e1d9b270ca1051fece868738d854d4e9 如果道具是一个没有包裹在可观察对象中的简单数组，它可以工作。也许是因为如果它是一个可观察的数组，它需要一个可观察的组件数组，而不是一个简单的子组件数组。

然而两者并不等价。使用我的原始版本（其中选项是数组流）， props$ 可以不仅仅是 .of 可观察的。它的值可以在程序过程中改变，而第二个我被原始数组卡住了。

隔离组件的数组流是否存在问题？

使用cycle.js，我正在尝试创建一个可重复使用的组件，该组件可以在页面中多次存在，包括事件处理程序。

使用时DOMSource.select，它似乎与整个应用容器匹配。有没有办法.select只从我的（组件的这个实例）子元素中获取？

我正在cycle.js 中构建一个无限滚动器。我有一个 ajax 服务，每页返回 X 个结果。第一个请求的page id为0，但后续请求需要使用第一个结果集中返回的page id。结果放在dom中。当用户滚动到可见结果的底部时，会加载一个新集合并将其连接到列表中。我有一些有用的东西，但没有我想要的那么好。

缩短的版本如下所示：

主要问题是 ajax 请求与滚动位置相关联，并且可能在滚动期间触发多个请求。

作为我去抖滚动的那一刻，但它在这里并不理想。

关于如何编排流以便在需要时仅发送 1 个请求（当用户靠近页面底部时）的任何想法？

我虽然可能每页有一个唯一的 id 并在 getitem$ 上使用 .dropRepeats？我在结果中没有唯一的页面 id。

如果 Cycle 使用虚拟 dom，React 也是如此，那么为什么我不能在 Cycle.js 应用程序中使用 React组件？

是否可以使用将现有的 React 组件包装到 Cycle.js 组件中？

这个问题涉及到：Higher order FRP with React - 为什么没有发生？

我有以下片段：

这似乎呈现为：

请注意，没有呈现任何属性。我在这个文件中的 cycle.js 导入很简单：

在以下示例中（来自Collections README），听起来好像第三个参数充当过滤器：

但是，在我看来，好像我们正在获取所有点击并将它们映射为 null，而在addTodo$流中没有留下任何其他内容（即，没有任何用处）。此外，所有事件都应该仍然在sources流中，所以我看不出这会有什么用，或者至少我不明白它是如何像声称的那样作为过滤器工作的。

我正在尝试为 RxJS 5 重新创建 RxMarbles，但是当我更改集合的数据（特别是数据源的长度）时，我遇到了反馈问题。

我添加了console.logs 用于调试

熟悉 RxMarbles 的人请注意，我将“Diagram”重命名为“Timeline”。

该应用程序的基本结构是将所有必要的数据输入到一个全局接收器中，并提供给一个虚拟驱动程序，该驱动程序只接收数据并按原样重新发送（因此理论上，所有输出都应该是新输入）。

因此，问题可能出在我的代码的其他部分，所以如果有帮助，我很乐意发布代码的 codepen/plunkr。这确实有时有效，但并非一直有效。

这是控制台输出（删节）

注意marblesState有 4 个对象，但tdata返回的弹珠包含 3 个对象的数组。出于某种原因，Collection 仅返回 3 个项目。

任何帮助表示赞赏。谢谢！

我目前正在通过阅读官方“文档”和我能找到的任何示例来学习 Cycle.js。我仍在研究一些核心概念，特别是发现自己陷入了试图理解如何形成顶级组件的困境。我认为这是因为我仍在努力解决如何有效地使用流...

在我的场景中，利用 xstream 和 snabbdom，我有一个要以某种ul>li格式呈现的项目列表。我可以看到我的列表如何转换为li表单：

我不明白的是如何在不改变现有节点liNodes$的情况下将内部包装起来，例如ul

我假设上面的示例不是在容器中“嵌套”流内容的正确方法。我意识到这可能是由静态标记提供的，但想了解如何使用流运算符组成这个结构。

我正在研究 CycleJs，我正在寻找一种正确的方法来处理将道具传递给子组件。

实际上，我有以下内容：

它只允许进行一些输入，并将其显示在名为 Title 的子组件中。

我认为我应该使用流来处理将道具传递给我的孩子。

但我不明白为什么在这种简单的情况下使用流而不是原语会是一个更好的解决方案？

有些东西我可能还没有理解。

我意识到使用周期/时间可能有更好的方法，但我只是想了解基础知识。不知何故，我的 action$ 流似乎没有运行；我尝试使用 xs.periodic 构建多个模拟 dom。测试框架是 mocha。