vue 各种判断逻辑整理

  <el-form ref="form"  :model="form" :rules="rules" label-width="120px" >

 <!--下面是普通验证的逻辑-->
<el-form-item  :label="$t('我的名称')" prop="fundraisingProtocolNumber">
 <el-input v-model="form.name" :placeholder="$t('我的名称')" />
</el-form-item>
<!---下面是列表的验证逻辑-->

<el-table :data="form.list" border class="nowrapTable formTable">

                <el-table-column :label="$t('序号')" align="center" width="50">

                  <template slot-scope="scope">

                    {{ scope.$index + 1 }}

                  </template>

                </el-table-column>

                <el-table-column :label="$t('内容')" align="center" width="300">

                  <template slot-scope="scope">

                    <el-form-item :prop="'list.' + scope.$index + '.type'" :rules="list.type">

                      <el-select v-model="scope.row.type" :placeholder="$t('请选择')">

                        <el-option

                          v-for="dict in keyTermsType"

                          :key="dict.dictValue"

                          :label="$t(dict.dictLabel)"

                          :value="dict.dictValue"

                        />

                      </el-select></el-form-item>

                  </template>

                </el-table-column>
</el-table>

<!---子组件判断逻辑-->
<child :form-sysnc="form.child">

</el-form>

子组件内容
<el-form-item  :label="$t('我的名称')" prop="child.name">
 <el-input v-model="form.name" :placeholder="$t('我的名称')" />
</el-form-item>

在data{rules{}}里添加就行

1 常规判断
rules: {
dealType: [{ required: true, message: this.$t('必填信息'), trigger: 'blur' }]
}

2 表单内列表判断逻辑
list:{

type: [{ required: true, message: this.$t('必填信息'), trigger: 'blur' }]
}

3 子组件判断逻辑
rules:{
"child.name": [{ required: true, message: this.$t('必填信息'), trigger: 'blur' }]

}
4  直接添加的表单验证(可以加判断)
<el-form-item  :label="$t('我的名称')" prop="fundraisingProtocolNumber"　:rules=" [{ required: true, message: this.$t('必填信息'), trigger: 'blur' }]">
 <el-input v-model="form.name" :placeholder="$t('我的名称')" />
</el-form-item>