ip 表单验证 vue iview

template

<Row v-show="config.bindIP">
          <Col span="12">
          <FormItem label="绑定IP："
                    prop="userPhoto"
                    :rules="[{ required: true, validator: this.validateIPAddress, trigger: 'blur' }]">
            <Input placeholder="请输入"
                   v-model="formData.userPhoto"
                   :maxlength="20" />
          </FormItem>
          </Col>
        </Row>

methods

validateIPAddress (rule, value, callback) {
      if (value == null) {
        return callback(new Error('IP地址不能为空'))
      }
      let regexp = /^((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})(\.((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})){3}$/
      let valdata = value.split(',')
      let isCorrect = true
      if (valdata.length) {
        for (let i = 0; i < valdata.length; i++) {
          if (regexp.test(valdata[i]) === false) {
            isCorrect = false
          }
        }
      }
      if (!isCorrect) {
        callback(new Error('请输入正确的IP地址'))
      } else {
        callback()
      }
    },

参考地址：
vue 关于IP地址的校验
https://blog.csdn.net/Aku_2020/article/details/126172034