element ui table表格里面插槽的使用方法

1. 元素 

<el-table :data="tableData" style="width: 100%">
    <el-table-column prop="date" label="DATE">
    </el-table-column>
    <el-table-column label="ACCOUNT NUMBER">
        <template slot-scope="scope">  
            <p v-for="(item,index) in scope.row.number" :key="index" class="scopeItem">{{item}}</p>
        </template>
    </el-table-column>
    <el-table-column prop="name" label="NAME">
    </el-table-column>
    <el-table-column prop="email" label="EMAIL">
    </el-table-column>
    <el-table-column prop="type" label="ACCOUNT TYPE">
    </el-table-column>
    <el-table-column prop="platform" label="PLATFORM">
    </el-table-column>
    <el-table-column prop="currency" label="BASE CURRENCY">
    </el-table-column>
    <el-table-column prop="balance" label="ACCOUNT BALANCE">
    </el-table-column>
</el-table>

2. 数据

export default {
 
    data() {
 
        return {
 
            tableData: [{
                    date: "01/03/2018",
                    number: ['042018', '042018', '042018', '042018'],
                    name: "Danila Mega",
                    email: "danilamega@gmail.com",
                    type: "Standard STP",
                    platform: "MT5",
                    currency: "AUD",
                    balance: '$0'
                },
                {
                    date: "04/03/2018",
                    number: ['042018', '042018', '042018', '042018'],
                    name: "Navin Shanmugarajan",
                    email: "navin.shan@gmail.com",
                    type: "RAW ECN",
                    platform: "MT4",
                    currency: "USD",
                    balance: '$0'
                },
                {
                    date: "07/03/2018",
                    number: ['042018', '042018', '042018', '042018'],
                    name: "Alex Wu",
                    email: "alex.wu@vantagefx.com",
                    type: "Standard STP",
                    platform: "MT4",
                    currency: "AUS",
                    balance: '$0'
                },
                {
                    date: "11/03/2018",
                    number: ['042018', '042018', '042018', '042018'],
                    name: "Austem Plumber",
                    email: "austem.plumber@vantagefx.com",
                    type: "Standard STP",
                    platform: "MT5",
                    currency: "CAD",
                    balance: '$0'
 
                },
                {
                    date: "15/03/2018",
                    number: ['042018', '042018', '042018', '042018'],
                    name: "Rafael lobo",
                    email: "lobinho@hotmail.com",
                    type: "Standard STP",
                    platform: "MT4",
                    currency: "GBP",
                    balance: '$0'
                }
            ]
        }
    }
}

 

 

参考---https://blog.csdn.net/weixin_39907729/article/details/88532949?utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromMachineLearnPai2%7Edefault-1.baidujs&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromMachineLearnPai2%7Edefault-1.baidujs