自定义element中的table表格动态获取表头

element表格默认只需要传递进去数据，然后写死表头即可渲染数据。在本次业务开发过程中表格需求较多，表头数据不是固定的，最终解决为把table表格封装，页面中引入同一个table即可，而table通过父组件传递数据来动态渲染。

• 子组件

• 父组件引用

// 局部引用
import djSanTable from '/components/dj-sanTable'

components: {
    djSanTable
},

export default {
        data() {
            return {
                // 表头数据(随意写的数据）
                listLabel: [
                    {label: '车牌号', prop: 'carEntrustId'},
                    {label: '名称', prop: 'name'},
                    {label: '值', width: '', prop: 'carRewardId'},
                    {label: '价格', prop: 'carFundProvider'},
                    {label: '利润', prop: 'carFrameNo'},
                    {label: '大类', prop: 'carNo'},
                    {label: '小类', prop: 'acreage'},
                    {label: '有价格', prop: 'assetsType'},
                    {label: '极好价格', prop: 'incomePrice'},
                    {label: '优质价格', prop: 'rewardStatus'},
                    {label: '良好价格', prop: 'addTime'},
                    {label: '无价格', prop: 'addManagerName'},
                ],

                // 表格数据  (随意写的数据）
                tableData: [
                    {
                        carEntrustId: '1',
                        name: '23',
                        carRewardId: '34',
                        carFundProvider: '34',
                        carFrameNo: '354',
                        carNo: '534',
                        acreage: '93450',
                        assetsType: '44344',
                        incomePrice: '34',
                        rewardStatus: '23',
                        addTime: '23',
                        addManagerName: '23',
                    },
                    {
                        carEntrustId: '2',
                        name: '343',
                        carRewardId: '78',
                        carFundProvider: '34',
                        carFrameNo: '78',
                        carNo: '78',
                        acreage: '756',
                        assetsType: '354',
                        incomePrice: '34534',
                        rewardStatus: '23',
                        addTime: '23',
                        addManagerName: '23',
                    }
                ]
            }
        },
}

最后还需要提醒大家一点，本篇文章中的例子仅供参考学习，切误将本篇文章中的代码直接使用在正式项目当中。希望以上代码对大家有所帮助。