1、安裝外掛

npm install js-xlsx file-saver -S
npm install script-loader -S -D //它幫我們掛載了，不需要引入到main.js裡面

2、在src下建立一個資料夾vendor,並且引入Export2Excel.js

此處附上我專案中vendor的連結，直接拷過去就好：
vendor檔案拷貝連結

3、html中表格

<el-table 
id="excel-table" 
v-loading="loading" 
ref="filterTable" 
:data="tableData"        //表格中顯示的是tableDate中的內容
style="width: 100%">
  <el-table-column 
  prop="id" 
  label="Id" 
  sortable 
  width="80"
  ></el-table-column>
  <el-table-column
	prop="date"
    label="日期"
    sortable
    width="180"
    column-key="date"
    :formatter="fmtTime"
  >
  </el-table-column>
  <el-table-column prop="name" label="姓名" width="180"></el-table-column>
  <el-table-column prop="address" label="地址" :formatter="formatter"></el-table-column>
  <el-table-column
    prop="tag"
    label="標籤"
    width="100"
    :filters="[{ text: '家', value: '家' }, { text: '公司', value: '公司' }]"
    :filter-method="filterTag"
    filter-placement="bottom-end"
  >
    <template slot-scope="scope">
      <el-tag
        :type="scope.row.tag === '家' ? 'primary' : 'success'"
        disable-transitions
      >{{scope.row.tag}}</el-tag>
    </template>
  </el-table-column>
  <el-table-column label="操作">
    <template slot-scope="scope">
      <el-button @click="dialogFormVisible = true" size="mini" type="primary">Edit</el-button>
      <el-button @click="del(scope.row.id)" size="mini" type="danger">Delete</el-button>
    </template>
  </el-table-column>
</el-table>

4、button下載按鈕

 <el-button
	       :loading="downloadLoading"
	       class="filter-item"
	       type="primary"
	       icon="el-icon-download"
	       @click="handleDownload"  //繫結了handleDownload方法
	>Export</el-button>

5、tableDate中的資料，這個可根據自己的要求來

  tableData: [
    {
      id: 1,
      date: "2016-05-02",
      name: "王小虎",
      address: "上海市普陀區金沙江路 1518 弄",
      tag: "家"
    },
    {
      id: 2,
      date: "2016-05-04",
      name: "王小虎",
      address: "上海市普陀區金沙江路 1517 弄",
      tag: "公司"
    },
    {
      id: 3,
      date: "2016-05-01",
      name: "王小虎",
      address: "上海市普陀區金沙江路 1519 弄",
      tag: "家"
    },
    {
      id: 4,
      date: "2016-05-03",
      name: "王小虎",
      address: "上海市普陀區金沙江路 1516 弄",
      tag: "公司"
    },
    {
      id: 5,
      date: "2016-04-02",
      name: "王小虎",
      address: "上海市普陀區金沙江路 1516 弄",
      tag: "公司"
    }
  ],

6、下載按鈕繫結的方法handleDownload

  handleDownload() {
  // this.downloadLoading = true;
  import("@/vendor/Export2Excel").then(excel => {
    const tHeader = ["id", "date", "name", "address", "tag"];//要匯出後表頭是什麼，可以跟tableDate中的表頭不一致
    const filterVal = [
      "id",
      "date",
      "name",
      "address",
      "tag"
    ];
    const data = this.formatJson(filterVal, this. tableData)
   
    // const data = this.tableData;
    excel.export_json_to_excel({
      header: tHeader,
      data,
      filename: "table-list"  //匯出檔案的名，自定義就好
    });
    // this.downloadLoading = false;
  });
},
//下載方法中，需要用到的格式化json的方法
formatJson(filterVal, jsonData) {
  return jsonData.map(v =>
    filterVal.map(j => {
      if (j === "id") {  //此處如沒有要格式化的列，可以不用此判斷
        // return parseTime(v[j])
        return v[j];
      } else {
        return v[j];
      }
    })
  );
},