vue树形多列_vue实现树状表格效果

作者：木道寻08 | 2024-08-28 19:50:06

踩

vue树放入表格,再添加额外列

这篇文章主要为大家详细介绍了vue实现树状表格效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了vue实现树状表格的具体代码，供大家参考，具体内容如下

1. 初始化配置

安装模块：

npm i vue-table-with-tree-grid -S

main.js 文件

import ZkTable from 'vue-table-with-tree-grid'

Vue.component(ZkTable.name, ZkTable);

2. 使用

ref="table"

index-text="#"

:data="data"

:columns="columns"

:stripe="props.stripe"

:border="props.border"

:show-header="props.showHeader"

:show-summary="props.showSummary"

:show-row-hover="props.showRowHover"

:show-index="props.showIndex"

:tree-type="props.treeType"

:is-fold="props.isFold"

:expand-type="props.expandType"

:selection-type="props.selectionType">

{ { scope.row.likes.join(',') }}

export default {

name: 'example',

data() {

return {

props: {

stripe: false, // 是否显示间隔斑马纹

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/木道寻08/article/detail/1021869