vue组件横向树实现代码

将之前的用css3+jq实现的横向树样式简单封装成组件使用到vue项目中，文件名为transverseTree.vue

代码：

在父组件中使用import引入该组件：

注册组件：

在template中使用：

其中，treeData为一个数组，在data中给treeData一个初始值：

实现效果：

ps：需要特别说明的是，我目前的代码暂时只支持这两种样式，即：

1父节点-1子节点-1/多孙节点，或是1父节点-多子节点-1孙节点，样式是通过jq去判断修改的，以后有时间的话再去研究优化争取可复用性强一些。希望对大家能有所帮助。

总结

以上所述是小编给大家介绍的vue组件横向树实现代码。编程之家 52php.cn 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!