vue表单校验经纬度

1.在 util.js里面创建一个文件formValidation.js

const formValidation = {
    //经度
    validatorLongitude: (rule, value, callback) => {
        const reg = /^(\-|\+)?(((\d|[1-9]\d|1[0-7]\d|0{1,3})\.\d{0,15})|(\d|[1-9]\d|1[0-7]\d|0{1,3})|180\.0{0,15}|180)$/
        if(value === ""){
            callback(new Error('请输入经度'));
        }else{
            if(!reg.test(value)){
                callback(new Error('经度范围：-180~180（保留小数点后十五位）'));
            }
            callback();
        }
    },
//纬度
    validatorLatitude: (rule, value, callback) => {
        const reg = /^(\-|\+)?([0-8]?\d{1}\.\d{0,15}|90\.0{0,15}|[0-8]?\d{1}|90)$/
        if(value === ""){
            callback(new Error('请输入纬度'));
        }else{
            if(!reg.test(value)){
                callback(new Error('纬度范围：-90~90（保留小数点后十五位）'));
            }
            callback();
        }
    },
       
}
 
export default formValidation

2.在 mian.js里引用

import './styles/modal.scss'
// 经纬度验证
import formValidation from "./utils/formValidation";
Vue.prototype.formValidation = formValidation;

 3.然后可以直接在你的表单定义的 rules里面使用, trigger: "change"就可以边输入边校验

longitude: [
          {
            required: true,
 //此处的'formValidation'不可随着:model改变而改变，因为formValidations.js已经定义好的，全局使用
            validator: this.formValidation.validatorLongitude, 
            message: "经度范围：-180~180（保留小数点后十五位）",
            trigger: "change"
          }
        ],
        latitude: [
          {
            required: true,
            validator: this.formValidation.validatorLatitude,
            message: "纬度范围：-90~90（保留小数点后十五位）",
            trigger: "change"
          }
        ],