javascript - Mesosphere 的 Meteor.js 验证

Question

我正在尝试实现 Mesosphere用于验证我的 meteor 应用程序，但 Mesosphere 似乎没有接受我列出的一些 native 验证。

我只尝试了一次电子邮件格式验证，它是必需的长度。例如:

Mesosphere({
    name: 'signupForm',
    method: 'signupUser',
    fields: {
        email: {
            required: true,
            format: 'email',
            rules: {
                exactLength: 4
            },
            message: 'Wrong length'
        }
    },
    onFailure: function (errors) {
        messages = [];

        messages = _.map(errors, function (val, err) {
            console.log(val.message);
        });
    },
    onSuccess: function (data) {
        alert("Totally worked!")
    }
});

“onFailure”(和 onSuccess)回调似乎有效，因为它在我提交表单时记录了一些内容。这让我相信我也在表单提交事件中正确设置了它。如果我理解正确的话，你可以将表单对象传递给 Mesosphere 以创建 validationObject。例如:

var validationObject = Mesosphere.signupForm.validate(accountData);

提交后，它会将 Field Required 记录为错误，这很奇怪，因为我确实在该字段中输入了一些内容。它没有提到不正确的长度或格式。它会跳过“长度错误”消息，我在对象中的任何地方都找不到该消息。

所以我的问题是我做错了什么，没有得到该表单字段的错误输入的正确消息？谢谢:)

此外，愿意接受有关其他验证包的建议。 Mesosphere 利用 Meteor 的服务器/客户端功能进行验证，因此它似乎是一个不错的起点。

模板:

<template name="signup">
      <form name="signupForm" id="signup-form" class="panel" action="#">
        <div class="form-group">
          <label for="email">Email</label>
          <input type="text" name="email" id="email" class="form-control" />
        </div>

        <div class="form-group">
          <label for="password">Password</label>
          <input type="password" name="password" id="password" class="form-control" />
        </div>

        <div class="form-group">
          <input type="submit" value="Sign Up" id="create-account" class="btn btn-success pull-right">
        </div>
      </form> </template>

在对应的文件里面调用这个方法:

  signupUser: function(accountData) {
    var uid = Accounts.createUser(accountData);
  }

Answer 1

基本上我在这里看到的是您的规则没有反射(reflect)表单的验证方式。您有一封必须与电子邮件格式匹配的电子邮件，但是您有一条规则规定它的长度必须恰好为 4 个字符。更好的字段定义如下所示:

fields: {
    email: {
        required: true,
        format: 'email',
        message: 'Please enter a valid email address'
    },
    password: {
        required: true,
        rules: {
            minLength: 6,
            maxLength: 30,
        },
        message: "Password must be between 6 and 30 characters"
    }
}

我创建了一个 github 存储库，如果您愿意，您可以克隆并运行它来测试它。

https://github.com/copleykj/meso-test

希望这对您有所帮助。