javascript - Bacon.js 仅当 prop === true 时才将属性与 .and() 结合起来

标签 javascript frp bacon.js

我最近选择了 Bacon.js 并用它做了一些 UI,其中只有满足要求时才启用“注册”按钮,其中之一是检查用户名是否有效。

// Returns true or string with invalid reason
var isUsernameValid = username
    .map(function(value) {
        if(value.length < 4) {
            return 'Must be 4 characters at least';
        }

        if(!config.patterns['username'].test(value)) {
            return 'Can only have letters, numbers, periods, or underscores';
        }

        return true;
    });

它要么返回 true,要么返回用户名无效的原因。

后来我将所有结果与此结合起来:

password.and(username).and(isUsernameValid)
    .not().assign($(view['signup-submit']), 'toggleClass', 'disabled');

用户名和密码仅在有输入时才为 true,但由于 isUsernameValid 始终返回一个真实值,因此按钮最终会被错误启用。

是否有更好的方法来返回错误或通过传递函数来组合属性?

我想过声明另一个流/属性,以便在 value === true 时返回,但我试图避免这种情况。

最佳答案

问题是因为您的真实值包括有效和无效的情况。该函数永远不会返回错误值。如何将无效值和有效值分成真值和假值?

var isUsernameInvalid = username
  .map(function(value) {
    if(value.length < 4) {
      return 'Must be 4 characters at least';
    }

    if(!config.patterns['username'].test(value)) {
      return 'Can only have letters, numbers, periods, or underscores';
    }

    return false;
});

然后,对原来的代码没有太多改动

password.and(username).and(isUsernameInvalid.not())
  .not().assign($(view['signup-submit']), 'toggleClass', 'disabled');

关于javascript - Bacon.js 仅当 prop === true 时才将属性与 .and() 结合起来,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31066317/

相关文章:

javascript - 使用动态 html 填充元素

javascript - 在 .js 文件中嵌入 PHP 变量 java 的最佳方式

javascript - Office.js 在搜索中转义特殊字符

javascript - 如何在 Mvc 应用程序中使用 Bootstrap Datepicker 添加 Datepicker?

javascript - 一旦到达 404,如何中止正在发出 AJAX 请求的 Bacon.js 属性?

haskell - 优化 FRP 系统

haskell - ifB 在reactive-banana 中的实现

javascript - 准备一个函数以在生成器运行器中重复使用

javascript - 是否有可能以某种方式限制培根 Action `repeatedly`?

javascript - 响应式(Reactive)编程的初学者问题