el-input输入时检验经纬度

在Vue.js中，可以使用Element UI库中的`el-input`组件结合自定义验证规则来检验用户输入的经纬度。经纬度通常由两个部分组成：经度（longitude）和纬度（latitude），它们分别是一个浮点数，范围通常是负180到180度（经度）和-90到90度（纬度）。你可以创建一个自定义的验证函数，例如：

<template>
  <el-form-item label="地理位置">
    <el-input v-model="location" placeholder="请输入经纬度(例如: 116.404, 39.904)">
      <el-input-validator :rules="{ latitude: { type: 'number', min: -180, max: 180 }, longitude: { type: 'number', min: -180, max: 180 } }"
        :message="validateMessage" />
    </el-input>
  </el-form-item>
</template>

<script>
export default {
  data() {
    return {
      location: '',
      validateMessage: '请输入有效的经纬度值'
    };
  },
  methods: {
    validateLocation(value) {
      const [lat, lon] = value.split(',');
      if (isNaN(lat) || isNaN(lon)) return false;
      return lat >= -90 && lat <= 90 && lon >= -180 && lon <= 180;
    }
  },
  watch: {
    location(newVal, oldVal) {
      this.$refs.input.validate(this.validateLocation(newVal));
    }
  }
};
</script>

在这个例子中，我们设置了`latitude`和`longitude`字段的验证规则，限制了输入的数值范围。当用户输入位置信息后，`validateLocation`方法会检查格式是否正确，并触发`el-input`的验证。如果验证失败，错误消息会在`validateMessage`属性中显示。