问题标签 [xstream-js]

作为一个新手，我正在尝试在 Cycle.js 中创建包含 3 个项目的列表。但是代码有错误。我制作了jsbin并将代码也放在了下面

http://jsbin.com/labonut/10/edit?js,输出

问题：当我点击最后一个复选框时，它会添加新的复选框（我不想要），而旧的不会改变它的“开/关”标签。除了最后一个，其他的都没有反应。我究竟做错了什么？

在 TypeScript 手册中是声明合并的示例：

由于 Webpack 编译了我的 TypeScript 代码，我可以使用 npm 模块xstream，它附带此类型定义：

我可以这样使用它（map是一种有效的方法）：

我想扩展Stream接口并尝试类似于官方示例的东西。所以在我的情况下，它"xstream"不是，"./observable"我的扩展名在文件extensions.ts而不是map.ts 中：

可悲的是，我收到多个错误：

我该如何修复它们？

使用过的版本

我正在尝试将流合并为一个，并在 h1 中显示文本，但未成功。

但无法使其工作：

这是我的代码：

它显示错误说：

试图理解为什么，但到目前为止还没有运气。

我有一段代码，使用 cycle.js 和响应式 xstream 库，如下所示。它由一个表单字段组成，其值在提交时呈现在 ap 标记中。问题如下： 1、如何在提交表单时将表单的输入域重置为默认值？2. 有没有办法在提交后将 input$ 和 submit$ 流重置为其初始值？

有没有更好的方法来创建这样的表单？PS formIntent 函数的输出被馈送到 formView 函数的输入。

使用 cycle.js 和 xstream，我想计算按钮点击次数并重置它们。

我打算通过在最后一次重置后计算所有按钮点击来实现这一点。为此，我想放弃所有按钮点击，直到最后一次重置，并计算剩下的内容。

但是我留下了 2 个不起作用的按钮

有什么建议吗？

我正在尝试编写一个演示同构Cycle.js / Hapi.js应用程序，但它在服务器上呈现时在 xstream 中出现异常而失败。这里出了什么问题？我的应用基于Cycle.js 的同构应用示例。

回溯看起来像这样：

渲染代码基本上如下所示：

您可以在此处找到完整的源代码。

我使用 Node v6.6.0、babel-node 6.14.0、Hapi 15.0.3、@cycle/dom 12.2.5 和 @cycle/xstream-run 3.1.0 在 OS X 上运行。如果您需要更多信息，请告诉我。

我正在使用 xstream 尝试 CycleJS，但我找不到既能挽救错误（例如 422）又能从 HTTP 驱动程序获取 JSON 响应的方法。

为了避免出现错误，我使用了 xstream replaceError，它的工作方式似乎是这样的：

但是，API 返回一条我想向用户显示的错误消息，如果替换为默认对象，它就会丢失。设置的唯一属性response$是实际的请求数据。

版本：

任何想法表示赞赏！

页面上有一个按钮元素和以下点击流：

一旦我单击按钮，true就会记录下来，这是正确的。

但是，当我映射流时，里面的代码会运行两次：

不应将其他事件处理程序附加到按钮，并且元素本身位于 div 内：

通常event.preventDefault()并event.stopPropagation()没有什么区别，并且检查事件确实表明它是从同一个 element 触发的button.btn--add。

不太确定发生了什么，任何想法表示赞赏！谢谢！

版本：

更新 1：我检查了三次，没有 JS 文件被加载两次。我正在使用 Webpack 捆绑app.js页面上加载的单个文件（Elixir/Phoenix 应用程序）。此外，Event Listeners在 Chrome 的开发者工具中检查选项卡中的按钮时，似乎只附加了 1 个处理的事件。

更新 2： 代码要点

可运行示例： 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只从我的（组件的这个实例）子元素中获取？