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就好了,否则有可能校验不起来

相关推荐
阿凤218 分钟前
uniapp运行到app端怎么打开文件
android·前端·javascript·uni-app
久爱@勿忘10 分钟前
vue/uniapp H5页面截图
开发语言·前端·javascript
渔舟小调21 分钟前
P12 | 标签体系:灵活的多维标签设计与前端联动
前端
小李子呢021138 分钟前
前端八股浏览器网络(2)---cookie,localStorage,sessionStorage
前端·网络
小李子呢021143 分钟前
前端八股Vue---插槽
前端·javascript·vue.js
一 乐1 小时前
咖啡商城|基于springboot + vue咖啡商城系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·咖啡商城系统
学习使我健康1 小时前
Android 事件分发机制
android·java·前端
众少成多积小致巨1 小时前
libbinder_ndk 入门指南
前端·c++·架构
小李子呢02111 小时前
前端八股Vue---自定义组件(控件)
前端·javascript·vue.js
用户52709648744901 小时前
微前端(qiankun)单侧启动调试技巧
前端