<template>
  <div class="bidsInfo">
    <el-table ref="singleTable" :data="noticeData" highlight-current-row style="width: 100%;margin-top:40px;">
      <el-table-column type="index" label="序號" width="50">
      </el-table-column>
      <el-table-column property="title" label="
 
標題">
        <template slot-scope="scope">
          <span style="cursor: pointer;">{{scope.row.title}}</span>
        </template>
      </el-table-column>
      <el-table-column property="hytype" width="160" align="center">
        <template #header>
          型別
          
 
<el-select v-model="typeVal" placeholder="請選擇">
            <el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </template>
      </el-table-column>
      <el-table-column property="
 
date" label="日期" width="120">
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  export default {
    name: 'bidsInfo',
    data() {
      return {
        typeVal: "all",
        typeOptions: [{
          value: 'all',
          label: '全部'
        }, {
          value: 'engineering',
          label: '工程'
        }, {
          value: 'goods',
          label: '貨物'
        }, {
          value: 'service',
          label: '服務'
        }, {
          value: 'other',
          label: '其他'
        }],
        noticeData: [{
          date: '2016-05-02',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1518 弄'
        }, {
          date: '2016-05-04',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1517 弄'
        }, {
          date: '2016-05-01',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1519 弄'
        }, {
          date: '2016-05-03',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1516 弄'
        }, {
          date: '2016-05-02',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1518 弄'
        }, {
          date: '2016-05-04',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1517 弄'
        }, {
          date: '2016-05-01',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1519 弄'
        }, {
          date: '2016-05-03',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1516 弄'
        }, {
          date: '2016-05-02',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1518 弄'
        }, {
          date: '2016-05-04',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1517 弄'
        }, {
          date: '2016-05-01',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1519 弄'
        }, {
          date: '2016-05-03',
          hytype: "工程",
          title: '上海市普陀區金沙江路 1516 弄'
        }],

      }
    }
  };
</script>

element 官網上el-table上使用插槽 slot=“header”來實現自定義表頭，在表頭中使用el-select元件選擇不同的狀態，無法展示選擇後的狀態，將slot=“header” 改成#header ，就可以了

參考部落格https://blog.csdn.net/weixin_43899935/article/details/105137626