combineWith与onValues在Bacon.js

Question

我有两个Bacon.jQuery Models (但是这个问题可以用任何培根Observable来说明)。

我有三个组合框：foo，bar和quux。bar依赖于foo，quux依赖于bar和quux的组合。有一个findQuux函数，它从foo和bar中为quux组合框找到一个值。

如果用户更改foo组合框，则会选择bar和quux框中的值。下面是quux选择的一个工作实现：

// WORKS
var quuxBus = new Bacon.Bus()
Bacon.onValues(fooModel, barModel, function (foo, bar)
{
    quuxBus.push(findQuux(foo, bar))
})
quuxModel.addSource(quuxBus.toProperty('quux4'))

这个解决方案有一个小问题，因为我需要'quux4'黑客在页面加载时正确地设置quux。但以下简单的解决方案根本不起作用：

// DOESN'T WORK
var quuxCombo = Bacon.combineWith(findQuux, fooModel, barModel)
quuxModel.addSource(quuxCombo)

问题是，findQuux预期foo和bar的有效组合，当无法找到quux的不可能组合时，它们就会崩溃。

onValues/push解决方案可以工作，因为当用户更改foo组合框时，只调用findQuux一次。bacon.combineWith解决方案无法工作，因为findQuux被调用了两次。

为quuxModel实现数据源的推荐方法是什么？对findQuux进行防御性编码不是一种选择。

完整的代码可以在http://jsfiddle.net/5zp4D/8/找到

更新：页面加载中foo和bar已经有了合理的值。从小提琴链接中可以看出，fooModel是使用显式值初始化的，而barModel是从该初始值重新计算的：

var fooModel = Bacon.$.selectValue(fooDom, 'foo2-value')
var barModel = Bacon.$.selectValue(barDom)

barModel.addSource(fooModel.map(function (x)
{
    return json[x][1].val
}))

foo和bar从不使用无效的值。而且，一旦用户更改了bar，就会重新填充foo，因此在UI中只能看到有效的组合。

combineWith方法的问题是当用户切换foo时，使用中间值调用findQuux函数两次，其中一个中间组合是不正确的，而组合成分则分别正确。我改变了小提琴以更好地说明问题：http://jsfiddle.net/5zp4D/12/

从var json可以看出，有效的组合是1-1，1-2，2-3，2-4和2-5.

我取消了坏的版本，增加了日志记录。当您选择foo1，然后在第一个组合框中选择back foo2时，您将在日志中获得4条消息，而不是3：

在页面加载中，可以看到quux值被正确初始化(2-4)：

"valid combination of foo2-value and bar4-value"

当您选择foo1而不是foo2时，您会看到findQuuxDef被调用为1-4 (foo是新的，bar是旧的)，然后是2-4 (foo是新的，bar是新的)：

"invalid combination of foo1-value and bar4-value"
"valid combination of foo1-value and bar2-value"

我的问题是，onValues/push方法不会出现无效的中间组合，我想知道什么是使用链接元素的UI的惯用方法。

Answer 1

首先，让quuxCombo只输出findQuux的有效值。我更希望为页面加载中的输入foo和bar设置合理的值，但是如果这是不可能的(为什么不能呢？)，我会在输入上使用filter。例如,

var quuxCombo = Bacon.combineWith(findQuux, fooModel.filter(validFoo), barModel.filter(validBar))

不过，我想，在有效输入存在之前，您希望从一些初始值开始。为此，我将一个新方法Property.startWith添加到Bacon.js 0.6.15中。所以，现在你可以

var quuxCombo = Bacon.combineWith(findQuux, fooModel.filter(validFoo), barModel.filter(validBar)).startWith("quux4")