首先看一下代码
<el-form
ref="loginForm"
:model="loginInfo"
:rules="loginRules"
class="login-form"
auto-complete="on"
label-position="left"
>
ref
属性涉及Dom 元素的获取(el-form表单对象)。
javaSrcipt 获取Dom 元素是通过:document.querySelector(".input")
获取dom元素节点 。
Vue 为简化DOM获取方法提出了ref
属性和$refs
对象。一般的操作流程是:ref
绑定控件,$refs
获取控件。
Element官方文档中写到:
model
是表单数据对象,rules
是表单验证规则。
Form 组件提供了表单验证的功能,只需要通过 rules
属性传入约定的验证规则,并将 Form-Item 的 prop
属性设置为需校验的字段名即可。
里面的逻辑大概是,在el-form-item上写一个prop
,这个prop
左手对应着数据源(即用model.prop
找到对应的数据源),右手对应着验证规则(即用rules.prop
找到对应的规则),然后进行验证。
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
评论(0)