Element-UI中el-table實現簡單動態數據綁定的實現

El-Table動態綁定數據的方法

在使用el-table時，有時候數據的列是不固定的，都是通過sql查詢來的，怎么實現動態的數據綁定到el-table上了?

看了看官網也沒有相關的例子，網上看了下都是封裝組件的,咱也不會，最后用了個v-for來實現一下。

后台返回的數據如下：

{"評分人":"15034100248","ID":"BD20200915170817","總分":333,"均分":83,"計數":4,"name":"111"},{"評分人":"13903417124","ID":"BD20200915170817","總分":301,"均分":75,"計數":4,"name":"222"}]

那么我們el-table中需要綁定的列名就是數據中的鍵名稱，鍵名可以通過key得到，只要讀取第一行數據就能獲取到整個表格的列名稱了，下面用一個v-for來讀取第一行數據。

export default {
    name:'QList',
    data(){
        return{
            fenxiNameData:[],//上面返回的數據
 },

<el-table :data="fenxiToNameData" border highlight-current-row style="width:100%" >
     <el-table-column v-for="(book,key,index) in fenxiToNameData[0]" :key="index" :prop="key" :label="key" align="center">
     </el-table-column>
</el-table>

這樣子就把數據綁定到表上了，不過沒法用排序功能了，沒有生效，不知道為什么。