ant vue里表格(a-table)的二次封装
2021-03-24 本文已影响0人
雯几
此代码二次封装主要是解决slot插槽的问题
<script>
export default {
props: {
columns: Array,
dataSource: Array
},
render () {
const on = {
...this.$listeners
}
const props = {
...this.$attrs,
...this.$props,
...{
dataSource: this.dataSource,
columns: this.columns
}
}
const slots = Object.keys(this.$slots).map(slot => {
return (
<template slot={slot}>{this.$slots[slot]}</template>
)
})
const table = (
<a-table bordered props={props} scopedSlots={this.$scopedSlots} on={on}>
{slots}
</a-table>
)
return (
<div class="w-table">{table}</div>
)
},
};
</script>
<style lang="scss">
</style>