javascript - 使用 Bacon.js 切换按钮

Question

假设我有一个按钮#button。我希望它切换某些元素#element的可见性。所以用普通的 jQuery 我会这样做

$("#button").on("click", function() {$("#element").toggle();})

或者有明显的副作用:

var visible = true;
$("#button").on("click", function() {visible = !visible; $("#element").show(visible);})

Bacon.js 中的等效项是什么。我认为可以做到没有任何副作用，但我不知道如何做到。

编辑:让我澄清一下:没有任何不属于 Bacon.js 对象一部分的副作用。

Answer 1

文档给出了一个几乎字面的示例，说明如何使用 .assign 做到这一点和 $.fn.asEventStream :

$("#button").asEventStream("click").assign($("#element"), "toggle");

注意事项:对于事件流，您无法使用 Property::assign 方法，但 onValue 的工作方式相同。我们还想确保toggle不使用事件作为参数来调用，因此您宁愿使用

$("#button").asEventStream("click").onValue($("#element"), "toggle", null, null);

<小时/>

对于显式状态，我们使用 scan method :

$("#button").asEventStream("click") // a stream of click events
.scan(true, // iterate it, starting with true
      function(visible, e) {
     // ignore the event parameter
     return !visible; // just toggle the boolean
}) // now we've got a property of a changing boolean value
.assign($("#element"), "show");