<template slot-scope="scope">

在實際的使用過程中，這種用法當然不僅僅局限於此，其他的地方也會用到。到底這里有什么特別之處呢？

我們看看普通的table用法：

 

 

我們先說一說這個基礎的用法里面，在el-table中，:data="tableData"是數據集，結構如下：

 

 

那么對於每一個el-table-column，我們只需要使用prop="date"，就可以將該列的數據綁定為該數組所有的對象中的“date”屬性，我們可以理解為對於tableData，這里始終取的是tableData[$index].date。

table按照tableData這個數組的長度來生成多少行，按照有多少個el-table-column來生成多少列。

 

現在我們可以看更高級的用法，也就是我們標題提到的<template slot-scope="scope">

 

<el-table-column
label="日期"
width="180">
<template slot-scope="scope">
<i class="el-icon-time"></i>
<span style="margin-left: 10px">{{ scope.row.date }}</span>
</template>
</el-table-column>
按照我們前面的理解，按照有多少個el-table-column來生成列，因此這里沒有使用prop="date"，生成的單元格也就是空白的一個單元格。

template（模版） 在這里屬於一個固定用法： <template slot-scope="scope">

我們主要說一下這個scope是個什么東西，按照element上的提示：

通過 Scoped slot 可以獲取到 row, column, $index 和 store（table 內部的狀態管理）的數據

我們可以理解為：tableData是給到table的記錄集，scope是table內部基於tableData生成出來的，我們可以用Excel描繪一下

 

 

我們傳進去的tableData，在table內部生成了類似於Excel的scope，因此，通過scope.row.date，我們就可以讀取到每一行中的date。

還有重要的一點，scope又並非是整個table，我們只是能通過scope.row獲得當前的行數據，至於具體為什么，目前我還沒有理解得很透徹。只是希望按照這個理解，能記住多點關於scope的使用。