横向排列"/>
vue中的横向排列
实现效果图如下:
image.png
数据格式 tree
let dataInfo = [
{
name: "root",
value: "root",
children: [
{
name: "child1",
value: "一级1",
children: [
{
name: "child2",
value: "二级1",
children: []
},
{
name: "child2",
value: "二级2",
children: []
}
]
},
{
name: "child1",
value: "一级2",
children: [
{
name: "child2",
value: "二级3",
children: [
]
}
]
}
]
}
]
实现代码 递归调用最小实现单元 组件NodeTree.vue
class="vertical-line"
:style="computedHeight(item.height, data.length, index)"
v-if="item.name !== 'root'"
>
{{item.value}}export default {
name: "equipList",
props: {
data: Array
},
data() {
return {
更多推荐
vue中的横向排列
发布评论