上次使用vue具名插槽的方式来实现了table表格的封装,这次换一种更实现方式,让页面代码变得更加简洁,先说一下这次使用的是动态组件来实现封装,话不多说,直接上代码
###table封装
<template>
<el-table :data="tableData" style="width: 100%">
<template v-for="(column,index) in tableHead">
<el-table-column :key="index" :prop="column.field" :label="column.label" width="180" v-if="!column.component" />
<el-table-column :key="index" :prop="column.field" :label="column.label" width="180" v-else>
<template slot-scope="scope">
<!-- 这里用tableHead传递过来的组件渲染\ -->
<component :is="column.compo