vue.js 表单参数验证方法

来源:互联网 发布:淘宝一千零一夜的老板 编辑:程序博客网 时间:2024/06/07 19:01
vue.js 编写验证表单参数是否为空,为空返回null,否则返回表单参数值

一、util.js

var utils = {    // 校验表单是否为空    validate: function (data, except) {        for (var item in data) {            // 校验表单,except为排除项            if (!this.contains(except, item)) {                if (data[item].toString().trim() == '') return null;            }        }        return data;    },    // 校验数组是否包含某元素    contains: function (arr, obj) {        var i = arr.length;        while (i--) {            if (arr[i] === obj) {                return true;            }        }        return false;    },    // 复制map    copyMap: function (mapObj) {        let newMap = {};        for (var item in mapObj) {            newMap[item] = mapObj[item];        }        return newMap;    }}export default utils

二、index.js 引入

import util from './util';Vue.prototype.$util = util;

三、页面使用

<script>    export default {        data: function () {            return {                dialog: {                    show: false,                    title: '',                    data: {}                }            }        },        ready: function () {        },        methods: {            save: function () {                let dialogData = this.$util.copyMap(this.dialog.data);                // 排除参数status,btnColor,btnTextColor的校验                dialogData = this.$util.validate(dialogData, ['status', 'btnColor', 'btnTextColor'])                if (dialogData) {                        # do something                    );                } else {                    this.$dispatch('alert', '信息不完整', '', 'danger');                }            },        }    }</script>
原创粉丝点击