el-form只对rules中个别字段进行校验

正常属性校验方式

js 复制代码
const moveToErr = () => {
  const errorDom = document.getElementsByClassName('el-form-item__error');
  console.log(errorDom)
  if (errorDom.length) {
    errorDom[0].scrollIntoView({
      block: 'center',
      behavior: 'smooth'
    })
  }
};

const saveItem = async (formEl?: FormInstance | undefined) => {
  const newFormEl = formEl?.[0] ? formEl[0] : formEl;
  if (newFormEl) {
    const valid = await newFormEl.validate((valid, fields) => !!valid);
    if (!valid) {
      moveToErr();
      return false;
    }
  }
}

针对个别属性进行校验(validateField)

js 复制代码
const submitVideoUpload = async (formEl?: FormInstance | undefined) => {
  const newFormEl = formEl?.[0] ? formEl[0] : formEl;
  console.log(newFormEl, 'newFormEl')
  if (newFormEl) {
    const valid = await newFormEl.validateField('video', (valid, fields) => !!valid);
    if (!valid) {
      moveToErr();
      return false;
    }
  }
}
相关推荐
NickJiangDev7 小时前
Elpis-Core 技术解析:从零构建一个基于 Koa 的企业级 Node.js 框架内核
前端
我要让全世界知道我很低调7 小时前
来聊聊 Codex 高效编程的正确姿势
前端·程序员
NickJiangDev7 小时前
Elpis Webpack 工程化实战:Vue 多页应用的构建体系搭建
前端
米饭同学i7 小时前
GitLab CI/CD + Vue 前端 完整方案
前端
yuki_uix7 小时前
遇到前端题目,我现在会先问自己这四个问题
前端·面试
Wect7 小时前
JS 手撕:对象创建、继承全解析
前端·javascript·面试
PeterMap7 小时前
Vue.js全面解析:从入门到上手,前端新手的首选框架
前端·vue.js
3秒一个大7 小时前
深入理解 JS 中的栈与堆:从内存模型到数据结构,再谈内存泄漏
前端·javascript·数据结构
weixin_413838567 小时前
基于区块链的校园二手书交易系统
vue.js·spring·区块链·fabric
Mr_Xuhhh7 小时前
深入Java多线程进阶:从锁策略到并发工具全解析
前端·数据库·python