代码备份

代码并不完整

校验功能代码：

const async = require('async');


const validatorsHelpers = {
    required(defData) {
        defData = defData || {};
        function returnFunc(data, cb) {

            if (data.fieldValue) {
                cb(null, data);
                return;
            }
            cb(defData.msg || data.fieldName + " field is required", data);
        }
        return returnFunc;
    },
    regex(defData) {
        defData = defData || {};
        function returnFunc(data, cb) {

            if (defData.regex.test(data.fieldValue)) {
                cb(null, data);
                return;
            }
            cb(defData.msg || data.fieldName + " field is invalid", data);
        }
        return returnFunc;
    },
    phone(defData) {
        defData = defData || {};
        defData.regex = /(^(13\d|14[57]|15[^4,\D]|17[678]|18\d)\d{8}|170[059]\d{7})$/;
        defData.msg = defData.msg || "请输入有效的手机号";
        return validatorsHelpers.regex(defData);
    }
};

function validateRun(validators, data) {
    var tasks = [];

    function wapper(validator) {
        return function(done) {
            validator(data, done);
        }
    }

    for (var task of validators) {
        tasks.push(wapper(task));
    }

    return function(cb) {
        async.series(tasks, function(err) {
            data['error'] = err;
            cb(null, data);
        });
    }
}

function validate(data, fields, cb) {
    var tasks = [];
    for (var fieldName of Object.keys(fields)) {
        var validatorsObj = fields[fieldName];
        var fieldValue = data[fieldName];
        var validators = [];

        if (validatorsObj !== null && Object.prototype.toString.call(validatorsObj) !== '[object Array]') {
            validators = [validatorsObj];
        } else {
            validators = validatorsObj;
        }
        if (!validators) {
            validators = [];
        }

        tasks.push(validateRun(validators, {'fieldName': fieldName, 'fieldValue': fieldValue}))
    }
    async.parallel(tasks, function (err, results) {
        var errors = {}, rData = {};
        for (var rs of results) {
            if (rs.error) {
                errors[rs.fieldName] = rs.error;
            } else {
                rData[rs.fieldName] = rs.fieldValue;
            }
        }
        cb(errors, rData);
    });
}

const Mixin = {

    validateAll(cb) {
        var data = this.state.data, fields = this.state.fileds;
        validate(data, fields, (errors, rData) => {
            this.setState({
                errors: errors
            });
            cb && cb(Object.keys(errors).length == 0, rData);
        });
    },
    validateOne(name, cb) {
        var data = this.state.data, fields = this.state.fields, allerrors = this.state.errors;
        var d = {}, f = {};
        d[name] = data[name];
        f[name] = fields[name];
        validate(d, f, (errors, rData) => {
            allerrors[name] = errors[name];
            console.info(errors, allerrors);
            this.setState({
                errors: allerrors
            });
            cb && cb(Object.keys(errors).length == 0, rData);
        });
    },
    handleChangeValidate(event) {
        var name = event.target.name;
        this.state.data[name] = event.target.value;
        this.setState({
            data: this.state.data
        });
        this.validateOne(name);
    }
};

module.exports = exports = {
    validate: validate,
    helper: validatorsHelpers,
    Mixin: Mixin
};

调用样例：（代码不全）

const Validateor = require('./common/validator');


const SomeForm = React.createClass({
    mixins: [Validateor.Mixin],

    getInitialState: function() {
        return {
            errors: {},
            data: {
                phone: ''
            },
            fields: {
                phone: [
                    Validateor.helper.required({errorMsg: "请输入手机"}),
                    Validateor.helper.phone(),
                    phoneExist // 其他自定义校验
                ]
            },
            phoneLoading: false
        };
    },

    onSubmit: function(e) {
        console.info("开始校验。。。。");
        this.validateAll().then(function() {
            console.info("校验结束。。。。");
            this.sendForm();
        }.bind(this));
    },

    render: function() {
        return (
            <div className="container">
                <form className="form-signin">

                    <PhoneInput
                        onChange={this.handleChangeValidate}
                        value={this.state.data.phone}
                        error={this.state.errors.phone}
                        />
                        onClick={this.onSubmit}>提交</Button>
                </form>

            </div>
        );
    }
});

转载于:https://my.oschina.net/ruben/blog/523474