1、在 el-form 上新增 :rules=「rules」，通過rules屬性傳入約定的驗證規則
2、給 el-form-item 新增屬性 props=「名稱」
3、在 data 中定義 rules
例子取自於官網
使用者名為自動校驗、其餘輸入框為自定義校驗。
"ruleform" status-icon :rules=
"rules" ref=
"ruleform" label-width=
"100px"
class
="demo-ruleform"
>
"使用者名稱" prop=
"uname"
>
"ruleform.uname"
>
<
/el-input>
<
/el-form-item>
"密碼" prop=
"pass"
>
"password" v-model=
"ruleform.pass" autocomplete=
"on"
>
<
/el-input>
<
/el-form-item>
"確認密碼" prop=
"checkpass"
>
"password" v-model=
"ruleform.checkpass" autocomplete=
"off"
>
<
/el-input>
<
/el-form-item>
"年齡" prop=
"age"
>
"ruleform.age"
>
<
/el-input>
<
/el-form-item>
"primary" @click=
"submitform('ruleform')"
>提交<
/el-button>
"resetform('ruleform')"
>重置<
/el-button>
<
/el-form-item>
<
/el-form>
<
/template>
export
default
settimeout((
)=>
else
else}}
,1000);
};varvalidatepass
=(rule, value, callback)
=>
else
callback()
;}};
varvalidatepass2
=(rule, value, callback)
=>
else
if(value !==
this
.ruleform.pass)
else};
return
, rules:,]
,//自定義校驗
pass:
, checkpass:
, age:
}};}
, methods:
else})
;},resetform
(formname)}}
<
/script>
<
/style>
vue elementUI專案搭建
安裝node 基於node之npm環境下操作vue，所以先部署node 安裝gitwget http 7 extras x86 64 packages epel release 7 11.noarch.rpm yum install y epel release 7 11.noarch.rpm yu...
重置表單（vue elementui）
第一種 在methods下的具體方法中直接乙個乙個地將表單繫結的值賦值為空 最笨的方法，只適用於僅幾個繫結值的情況下 第二種 elementui官網的方法 從這裡直接進入官網表單相關位置 model ruleform rules rules ref ruleform label width 100p...
vue elementUi許可權管理
第一次摸索著完成vue的許可權管理，在此記錄下自己搬磚的點點滴滴，希望以後回望的時候，有跡可循，也分享給需要的小夥伴們，參考哦 思路如下 1，登入成功後，把後台返回的使用者資訊，存vuex的state 2，vuex的actions調介面，返回資料後，賦值給state，然後呼叫遞迴，來把返回的資料處理...