原**結構如下:
"addobject" ref=
"objectform"
:rules=
"add_object_rules"
>
"目標名稱" prop=
"object_name"
>
<
/el-form-item>
"週期範圍" prop=
"objyear"
>
<
/el-form-item>
"負責單位" prop=
"group_ids"
>
<
/el-form-item>
//一層迴圈
for=
"(group, gindex) in addobject.addprogroup"
:key=
"gindex"
>
="add_project_form"
v-for=
"(pro, index) in group.pros"
:key=
"index"
>
//二層迴圈
class
="add_project_form"
v-for=
"(pro, index) in group.pros"
:key=
"index"
>
:prop=
"'pros.' + index + '.project_content'"
:rules=
"add_object_rules.project_content"
label=
"專案內容"
>
//具體驗證項
"pro.project_content"
>
<
/el-input>
<
/el-form-item>
<
/el-form-item>
<
/el-form-item>
<
/div>
<
/el-form>看了官網也查閱了很多資料,都有動態表單驗證的說法,於是我編寫了以上的結構,結果報了這個錯
就是說我prop對不上值,除錯了好久發現結構也對,資料也取到了,十分鬱悶,然後我終於查到了,原來裡面那層還要套乙個el-form…好吧,合理。
修改後**:
"addobject" ref=
"objectform"
:rules=
"add_object_rules"
>
"目標名稱" prop=
"object_name"
>
<
/el-form-item>
"週期範圍" prop=
"objyear"
>
<
/el-form-item>
"負責單位" prop=
"group_ids"
>
<
/el-form-item>
//一層迴圈
for=
"(group, gindex) in addobject.addprogroup"
:key=
"gindex"
>
="add_project_form"
v-for=
"(pro, index) in group.pros"
:key=
"index"
>
//二層迴圈
//---------新增--start-----
"group"
>
//---------新增--end-----
class
="add_project_form"
v-for=
"(pro, index) in group.pros"
:key=
"index"
>
:prop=
"'pros.' + index + '.project_content'"
:rules=
"add_object_rules.project_content"
label=
"專案內容"
>
//具體驗證項
"pro.project_content"
>
<
/el-input>
<
/el-form-item>
<
/el-form-item>
//---------新增--start-----
<
/el-form>
//---------新增--end-----
<
/el-form-item>
<
/div>
<
/el-form>參考文章:
el form表單驗證
如果table在form中,且需要對每個 進行驗證的話,需要對prop進行處理 el form上,model繫結的資料是json物件格式 el form item上,prop繫結的值必須可以通過.的方式從el form上的model繫結的物件中找到 即prop值和el form item中model...
el form單個表單域新增自定義驗證
直接把validator寫在data中會報undefined,我們需要把它改造一下,寫在methods中 下面貼 style width 20px height 20px margin 4px 將validator寫在methods中 methods callback imagevalidator ...
vue element 動態表單驗證
公司最近的專案有個新增動態表單的需求,總結一下我在表單驗證上遇到的一些坑。如圖是功能的需求,這個功能挺好實現的,但是表單驗證真是耗費了我一些功夫。vue element在表單驗證上有一些限制,必須依照element示例的格式才能驗證通過。附上 1 el form model dynamicvalid...