el-table中header里面写多层循环el-input无法修改其值

之前看别人加了

 @input.native="change($event, index)" 


change(e, index) {
      console.log('e', e, e.target.value);
      // this.tableColumns[index].fieldName = e;
      let obj = Object.assign({}, obj, { fieldName: e.target.value });
      this.$set(this.tableColumns, index, obj);

      this.$forceUpdate();
    }

但其实并不需要，只需要在template的slot="header"后面加里面加：slot-scope="scope"
如下代码：

<el-table :data="tableData" style="width: 100%">
      <el-table-column
        v-for="(column, index) in tableColumns"
        :prop="column.fieldName"
        :key="column.id"
        min-width="100"
      >
        <template slot="header" slot-scope="scope">
          <div class="header-title">
            <label>{{ column.fieldRemarks }}</label>
            <el-popover>
              <el-form :model="column" :rules="rules">
                <el-form-item label="字段英文名（不可修改）" prop="fieldName">
                  <el-input v-model="column.fieldName"></el-input>
                </el-form-item>
                <!-- @input.native="change($event, index)" -->
                <el-form-item label="字段标题" prop="fieldRemarks">
                  <el-input v-model="column.fieldRemarks"></el-input>
                </el-form-item>
                <el-form-item label="字段类型" prop="fieldType">
                  <el-select v-model="column.fieldType">
                    <el-option
                      v-for="item in fieldTypeOption"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-form>

              <div
                class="icon-con"
                slot="reference"
                @click="handleEdit(index, column.ifEdit)"
              >
                <i class="el-icon-arrow-down" v-if="column.ifEdit"></i>
                <i class="el-icon-arrow-up" v-else></i>
              </div>
            </el-popover>
          </div>
        </template>
        <template slot-scope="scope">
          <el-input v-model="scope.row[column.fieldName]"></el-input>
        </template>
      </el-table-column>
      <el-table-column>
        <template slot="header">
          <el-button
            v-no-more-click
            type="text"
            class="el-icon-plus"
            @click="addColumn"
          ></el-button>
        </template>
      </el-table-column>
    </el-table>