Question

我想要使用少量规则验证单个字段

有一个简单的例子。这是html形式：

<div class="form-group">
  <label for="fullName">Name</label>
  <input type="text" class="form-control" id="fullName" placeholder="Enter name">
</div>
<div class="form-group">
   <div id="fullNameErrors"></div>
</div>

这是我的验证功能：

function checkForm() {
    $("#fullNameErrors").hide();
    var fullName = $("#fullName").val();
    if (fullName.length < 4) {
        $("#fullNameErrors").show().html("Name too short");
    }
    var parts = fullName.split(" ");
    if (parts.length!=2) {
        $("#fullNameErrors").show().html("First name and last name expected");
    }
    if (parts[0].length<3) {
        $("#fullNameErrors").show().html("First name to short");
    }
}

当字段改变时，我调用checkForm（）。

如何使用Bacon.js以FRP方式实现相同的想法？

Answer 1

您可以将验证错误映射到Bacon.Error对象，如下所示：

var $errors = $("#fullNameErrors");
var $fullName = $("#fullName");

var nameChanges = $fullName.asEventStream("input").flatMapLatest(function() {
    var fullName = $fullName.val();
    if (fullName.length < 4) {
        return new Bacon.Error("Name too short");
    }
    // other validations here
    return fullName;
});

nameChanges.onValue(function(fullName) {
    console.log("Name ok: " + fullName);
    $errors.empty();
});

nameChanges.onError(function(error) {
    $errors.text(error);
});

使用JSFiddle尝试一下。查看有关Bacon.js错误处理https://github.com/baconjs/bacon.js#errors

的更多详细信息

使用bacon.js在单个字段上使用不同的错误消息进行多次验证的最佳方法是什么？

1 个答案: