el-form 表单设置某个参数非必填验证

html

<el-form ref="form" :rules="rules">
			 <el-form-item  prop="tiktokEmail" label="邮箱"   >
                <el-input v-model="form.tiktokEmail"  placeholder="邮箱" ></el-input>
              </el-form-item>
</el-form>

js

  data() {
    const validateEmailf = (rule, value, callback) => {
      // 此处是判断条件,当内容为空时表单验证直接通过,当内容不为空时再验证格式, callback();便是让其通过
      if (value==''||value==null||value==undefined) {
        callback();
      } else {
        if (!validateEmail(value)) {
          callback(new Error("请输入正确的邮箱格式"));
        } else {
          callback();
        }
      }
    };
    return {
      form: {
        tiktokEmail:''
      },
      // 表单校验
      rules: {
        tiktokEmail: [
          { required: true, trigger: "blur", validator: validateEmailf },
        ],
      },
    };
  },

在这里插入图片描述

效果

无内容状态
在这里插入图片描述

有内容状态:
在这里插入图片描述

相关推荐

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-04-28 22:08:02       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-04-28 22:08:02       100 阅读
  3. 在Django里面运行非项目文件

    2024-04-28 22:08:02       82 阅读
  4. Python语言-面向对象

    2024-04-28 22:08:02       91 阅读

热门阅读

  1. Git添加空文件夹

    2024-04-28 22:08:02       29 阅读
  2. C#面:IEnumerable的缺点有哪些

    2024-04-28 22:08:02       34 阅读
  3. Codeforces Round 941 (Div. 2) ABC

    2024-04-28 22:08:02       36 阅读
  4. RN传入数字返回拼音首字母的包

    2024-04-28 22:08:02       32 阅读
  5. go语言数据类型转换

    2024-04-28 22:08:02       35 阅读
  6. Python爱心代码

    2024-04-28 22:08:02       30 阅读
  7. next.js v14 从入门到跑路

    2024-04-28 22:08:02       32 阅读
  8. sci高效神器介绍第一站Overleaf!

    2024-04-28 22:08:02       31 阅读
  9. 微博博文爬取

    2024-04-28 22:08:02       25 阅读
  10. 【PHP】sign加签方法示例

    2024-04-28 22:08:02       35 阅读
  11. ROS2 ZEDX UBUNTU 环境配置

    2024-04-28 22:08:02       25 阅读