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;
    }
  }
}
相关推荐
雮尘26 分钟前
如何在非 Claude IDE (TARE、 Cursor、Antigravity 等)下使用 Agent Skills
前端·agent·ai编程
icebreaker26 分钟前
Weapp-vite:原生模式之外,多一种 Vue SFC 选择
前端·vue.js·微信小程序
icebreaker33 分钟前
重走 Vue 长征路 Weapp-vite:编译链路与 Wevu 运行时原理拆解
前端·vue.js·微信小程序
wuhen_n36 分钟前
代码生成:从AST到render函数
前端·javascript·vue.js
Lee川37 分钟前
从异步迷雾到优雅流程:JavaScript异步编程与内存管理的现代化之旅
javascript·面试
喝咖啡的女孩38 分钟前
浏览器前端指南
前端
wuhen_n40 分钟前
AST转换:静态提升与补丁标志
前端·javascript·vue.js
喝咖啡的女孩40 分钟前
浏览器前端指南-2
前端
cxxcode1 小时前
从 V8 引擎视角理解微任务与宏任务
前端
destinying1 小时前
性能优化之实战指南:让你的 Vue 应⽤跑得飞起
前端·javascript·vue.js