1、先上一张图:
2、官方文档:Vxe Table v4.6
主要是二个属性:
type: expand
slots: {
content: 'expandContent'
}
3、具体代码片段:
export const xzColumns: VxeGridPropTypes.Columns = [
// {
// title: '',
// type: 'checkbox',
// fixed: 'left',
// width: '50',
// align: 'center',
// },
{
title: '序号',
type: 'seq',
// fixed: 'left',
width: '50',
align: 'center',
sortable: true,
},
{
type: 'expand',
width: '50',
align: 'center',
slots: {
content: 'expandContent',
},
},
...
}
<template #expandContent="{ row, rowIndex }">
<div class="expand-wrapper">
这里是具体的内容
</div>
</template>
4、通过上面的设置,就可以轻松实现主细表格。
本站资源均来自互联网,仅供研究学习,禁止违法使用和商用,产生法律纠纷本站概不负责!如果侵犯了您的权益请与我们联系!
转载请注明出处: 免费源码网-免费的源码资源网站 » vxe-grid 实现下拉查看明细表格功能,主表、子表的功能。
发表评论 取消回复