在el-table中 el-select实现可下拉选择和手动输入_el-select可输入可选择

<el-table>
 <el-table-column  prop="pages"   label="页码" width="200">
          <template slot-scope="scope">
          <el-select  v-model="scope.row.pages"  ref="produceRef"  @blur="handleChange(scope.row)"
   allow-create filterable clearable>
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      placeholder=""
      :value="item.value"
    ></el-option>
  </el-select>
    </template>
        </el-table-column>
</el-table>
 
 
方法
   handleChange(row) {
          row.pages = this.$refs.produceRef.selectedLabel
          console.log(row, this.$refs.produceRef.selectedLabel, '输入的数据')
    // 处理输入的值直接回显逻辑
    if (!this.options.find(item => item.value === row.pages)) {
      // 如果输入的值不在选项列表中，将其作为新选项添加到选项列表中
      const newOption = {
        value: row.pages,
        label: row.pages
      };
      this.options.push(newOption);
    }
    this.$forceUpdate()
  },