el-table

table表头添加el-select，下拉框数据不显示问题

slot-scope="{}“添加这一段代码即可解决问题

<template slot="header" slot-scope="{}">
                    <span>项目:</span>
                    <el-select v-model="project" placeholder="请选择">
                        <el-option
                            v-for="item in projectList"
                            :key="item.project_id"
                            :label="item.project_name"
                            :value="item.project_name"
                        >
                        </el-option>
                    </el-select>
                    <el-button
                        type="success"
                        icon="el-icon-plus"
                        size="small"
                        @click="handleAddProjectClick"
                        plain
                        >新增环境</el-button
                    >
                </template>

table行内编辑

点击新增摁纽图例，新增一行，并且输入框自动获取焦点

点击编辑摁纽，进行编辑

代码如下：

<template>
  <el-table :data="tableData" style="width: 100%">
      <el-table-column fixed="left"  width="200">
          <template slot="header" slot-scope="scope">
              <el-button
                  round
                  plain
                  type="info"
                  size="small"
                  icon="el-icon-plus"
                  @click="
                      tableData.unshift({});
                      rowNum = 0;
                  "
                  >新增</el-button
              >
              <el-button
                  round
                  plain
                  type="info"
                  size="small"
                  icon="el-icon-check"
                  @click="handleTableSaveClick(scope)"
                  >保存</el-button
              >
          </template>
          <template slot-scope="scope">
              <el-button
                  round
                  plain
                  type="text"
                  size="small"
                  icon="el-icon-edit"
                  @click="rowNum = scope.$index"
                  >编辑</el-button
              >
              <el-button
                  round
                  plain
                  type="text"
                  size="small"
                  icon="el-icon-delete"
                  class="el-btn-text-danger"
                  @click="
                      tableData = tableData.filter(
                          (item, index) => scope.$index != index
                      )
                  "
                  >删除</el-button
              >
              <span></span>
          </template>
      </el-table-column>
      <el-table-column
          prop="index"
          label="名称"
          width="80"
          align="center"
      >
          <template slot-scope="scope">
              <el-input
                  v-model="scope.row.name"
                  v-if="scope.$index == rowNum"
              ></el-input>
              <span v-else>{
  { scope.row.name }}