Vue中使用ElementUI组件Form组件的校验validate

先准备一些el-form元素 这里面el-form中:model(v-bind:model)是单项绑定的,如果你写成了v-model=""可能会出现校验没有效果的情况。

这是校验过后的结果了

现在开始使用下吧!

1.在el-form中绑定一个ref,名字自拟,后续触发检验结果需要使用到它

2.准备rules对象,里面装校验的内容

3.需要校验的元素上需要加上prop,这个是对应校验的内容的。注意的是 如果是双向绑定的如(input)的prop的名字必须和绑定的元素名字一样,比如我的收集数据为SkuForm.skuName那么prop值为skuName就好了,否则有可能校验不起来

相关推荐
摸鱼的春哥1 天前
惊!黑客靠AI把墨西哥政府打穿了,海量数据被黑
前端·javascript·后端
小兵张健1 天前
Playwright MCP 截图标注方案调研(推荐方案1)
前端·javascript·github
小兵张健1 天前
AI 页面与交互迁移流程参考
前端·ai编程·mcp
小兵张健1 天前
掘金发布 SOP(Codex + Playwright MCP + Edge)
前端·mcp
小兵张健1 天前
Mac 上 Antigravity 无法调用 browser_subagent?一次 400 报错排查记录
前端
张拭心1 天前
编程最强的模型,竟然变成了国产的它
前端·ai编程
爱勇宝1 天前
2026一人公司生存指南:用AI大模型,90天跑出你的第一条现金流
前端·后端·架构
fe小陈1 天前
简单高效的状态管理方案:Hox + ahooks
前端
我叫黑大帅1 天前
Vue3和Uniapp的爱恨情仇:小白也能懂的跨端秘籍
前端·javascript·vue.js
Panzer_Jack1 天前
如何用 WebGL 去实现一个选取色彩背景图片透明化小工具 - Pick Alpha
前端·webgl