el-table 添加表单验证

  <el-form ref="formTable" :rules="rulesTable" :model="formTable" style="width:770px">
        <el-table :data="formTable.tableData" border style="width: 100%" class="table_box" height="200px">
          <el-table-column label="序号" width="50px" type="index" header-align="center" align="center"></el-table-column>
          <el-table-column prop="fieldName" label="字段名称" header-align="center" align="center">
          </el-table-column>

          <el-table-column prop="fieldType" label="数据类型" header-align="center" align="center">
            <template slot-scope="scope">
              <el-form-item :prop=" 'tableData.' + scope.$index + '.fieldType' " :rules="rulesTable.fieldType">
                <el-input v-model.trim="scope.row.fieldType" @change="handelChange(scope.row.fieldName,scope.row.fieldType)" :maxlength="20"></el-input>
              </el-form-item>
            </template>
          </el-table-column>

          <el-table-column prop="fieldDesc" label="字段描述" header-align="center" align="center">
            <template slot-scope="scope">
              <el-form-item :prop=" 'tableData.' + scope.$index + '.fieldDesc' " :rules="rulesTable.fieldDesc">
                <el-input v-model="scope.row.fieldDesc" @change="handelChange(scope.row.fieldName,scope.row.fieldDesc)" :maxlength="20"></el-input>
              </el-form-item>
            </template>
          </el-table-column>

          <el-table-column prop="sortNo" label="序号" header-align="center" align="center" width="70px">
            <template slot-scope="scope">
              <el-form-item :prop=" 'tableData.' + scope.$index + '.sortNo' " :rules="rulesTable.sortNo">
                <el-input v-model="scope.row.sortNo" @change="handelChange(scope.row.fieldName,scope.row.sortNo)" :maxlength="20"></el-input>
              </el-form-item>
            </template>
          </el-table-column>

          <el-table-column prop="input" label="查询条件别名" header-align="center" align="center">
            <template slot-scope="scope">
              <el-form-item :prop=" 'tableData.' + scope.$index + '.fieldConditionName' " :rules="rulesTable.fieldConditionName">
                <el-input v-model="scope.row.fieldConditionName" @change="handelChange(scope.row.fieldName,scope.row.fieldConditionName)" :maxlength="20"></el-input>
              </el-form-item>
            </template>
          </el-table-column>

          <el-table-column prop="required" label="非空" header-align="center" align="center" width="50px">
            <template slot-scope="scope">
              <el-checkbox v-model="scope.row.required" @change="handelChange(scope.row.fieldName,scope.row.required)"></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column prop="address" label="操作" header-align="center" align="center" width="70px">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="handleDelete(scope.row.fieldName)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-form>

 rulesTable: {
        fieldType: [{ required: true, message: "数据类型不能为空", trigger: "blur" }],
        fieldDesc: [{ required: true, message: "字段描述不能为空", trigger: "blur" }],
        sortNo: [{ required: true, message: "序号不能为空", trigger: "blur" }],
        fieldConditionName: [{ required: true, message: "条件别名不能为空", trigger: "blur" }],
      },

ps 有个bug 删除的时候没有值和有值会产生错位 如果没有删除功能 正常用