element ui 里的表单验证说明

   < el-table-column  label= "操作"  width= "230" >
                     < template  scope= "scope" >
                         < el-button  class= 'btn'  size= "small" @ click= "handleEdit(scope.$index, scope.row)" >编辑 </ el-button >
                         < el-button  class= 'btn'  size= "small" @ click= "handleDel(scope.$index, scope.row)" >删除 </ el-button >
                     </ template >

                 </ el-table-column >//在表格中scope.$index表示行数    一行的内容scope.row


     < el-dialog  class= "edit-dialog" : title= "isedit==1?'修改':'新增'"  width= "90%" : visible. sync= "editFormVisible" : close-on-click-modal= "true" >//editFormVisible指的是是否显示弹窗,close-on-click-modal:指的是是否点击空白处关闭弹窗

       < el-form : model= "editForm"  label-width= "160px" : rules= "editFormRules"  ref= "editForm" >//editForm表单提交的数据
         < el-form-item  label= "所属平台名称"  prop= "fdcPlatform" >//规则editFormRules，需要验证的字段名fdcPlatform
           < el-input  v-model= "editForm.fdcPlatform" ></ el-input >
         </ el-form-item >
         < el-form-item  label= "产品链接" >
           < el-input  v-model= "editForm.fdcUrl" ></ el-input >
         </ el-form-item >
         < el-form-item  label= "文章标题"  prop= "fdcTitle" >
           < el-input  v-model= "editForm.fdcTitle" ></ el-input >
         </ el-form-item >
         < el-form-item  label= "文章内容"  prop= "fdcNote" >
           < el-input  v-model= "editForm.fdcNote" ></ el-input >
         </ el-form-item >
       </ el-form >
       < div  slot= "footer"  class= "dialog-footer" >//slot="footer"在右下角
         < el-button @ click. native= "editFormVisible = false" >取消 </ el-button >
         < el-button  type= "primary" @ click. native= "editSubmit" : loading= "editLoading" >提交 </ el-button >
       </ div >
     </ el-dialog >
editFormVisible:  false,
         //验证
         editFormRules: {
           fdcTitle: [
            {  required:  true,  message:  '请输入文章标题',  trigger:  'blur' }
          ],
           fdcPlatform: [
            {  required:  true,  message:  '请输入所属平台名称',  trigger:  'blur' }
          ],
           fdcNote: [
            {  required:  true,  message:  '请输入文章内容',  trigger:  'blur' }
          ],
        },
  isedit:  0,
  //编辑界面数据
         editForm: {
           ID:  0,
           fdcTitle:  '',
           fdcPlatform:  '',
           fdcNote:  '',
           fdcUrl:  '',
        },

          this. editForm =  Object. assign({},  row) //复制一个对象的意思，理解了很久   就是生拷贝，我觉得适合弹窗传数据，也适合提交数据用

        if ( typeof ( this. $refs. editForm) !=  'undefined')
           this. $refs. editForm. resetFields();//这里也理解了很久，我觉得就是为了重置验证规则使用，如果没写这个，等你写了一次不符合规则的字段是，会出现提示，等你到下次再打开，提示还在那里！
原文链接：https://blog.csdn.net/liang377122210/article/details/78490126