Element-UI 表格中使用输入验证

html 部分

<el-table
            ref="addPropertyTable"
            :data="ruleForm.propertyList"
            stripe
            border
            style="width: 100%;"
            height="250"
            :cell-style="cellStyleAlignCenter"
          >
            <el-table-column prop="name" label="名称"  >
              <template slot-scope="scope">
                  <el-form-item :prop="`propertyList.${scope.$index}.name`" class="tab-form"
                                style=" margin-bottom: 0" :rules="rulesTab.name">
                  <el-input v-model="scope.row.name"  class="tool-inp" placeholder="请输入属性名称"/>
                  </el-form-item>
                </template>
            </el-table-column>
</el-table>

data数据

data() {
      return {
        ruleForm:{
          propertyList:[
              name:''
          ]
        },
        rulesTab: {
          name: [
            { required: true, message: '请输入名称', trigger: ['blur','change'] }
          ]
        }
      }
}

为了能显示出提示文字，需要对 css 进行修改

<style lang="scss">     // 此处不可用scoped属性
.tab-form .el-form-item__error{
    position: relative;
    left: -20px;
    line-height: 1 !important;
  }
</style>