Element: Feature Request:Make it possible to create columns for el-table in code and bind to it html

[uwascan]

ElementUI version: 1.2.4

OS/Browsers version: Windows 10/Chrome 56

Vue version: 2.2.2

What is Expected?
Please, add an option to make it possible to create table columns in code and bind to it in html as shown below:

Current Syntax

        <el-table :data="records" border style="width: 100%" height="400"  stripe>
            <el-table-column prop="Ordinal" label="#" width="70" fixed></el-table-column>
            <el-table-column prop="DueDate " label="Due Date" width="140" fixed>/el-table-column>
            <el-table-column prop="Payment" label="Payment" width="150" ></el-table-column>
        </el-table>

Alternative Syntax

        <el-table :data="records" border style="width: 100%" height="400"  
            stripe :columns="tableColumns">
        </el-table>

This will make it possible to get a list of el-table-column from the backend etc

[gabrielboliveira]

Sorry, I referenced the wrong issue on my PR.

[diemah77]

I think you can use v-for in this case:

<el-table-column v-for="col in cols" :prop="col.prop" :label="col.label" :width="col.width">
</el-table-column>

[uwascan]

Cool. I never thought of that. Some times simple is not so simple. Sweet UI Library by the way.

[Chill-Cool]

How to make the v-for work for an array of object?
[
{id: 1,
name: "a1"},
{id: 2,
name: "a2"},
{id: 3,
name: "a3"}
....
]