Skip to content
On this page

Tree 树组件

<template>
  <w-tree :data="data"></w-tree>
</template>

<script setup>
const data = [
  {
    label: '一级 1', level: 1,
    children: [
      {
        label: '二级 1-1', level: 2,
        children: [
          {
            label: '三级 1-1-1', level: 3,
          }
        ]
      }
    ]
  }, 
  {
    label: '一级 2', level: 1,
    open: false,
    children: [
      {
        label: '二级 2-1', level: 2,
        children: [{
          label: '三级 2-1-1', level: 3,
        }]
      }, 
      {
        label: '二级 2-2', level: 2,
        children: [
          {
            label: '三级 2-2-1', level: 3,
          }
        ]
      }
    ]
  }, 
  {
  label: '一级 3', level: 1,
  open: true,
  children: [{
    label: '二级 3-1', level: 2,
    children: [{
      label: '三级 3-1-1', level: 3,
    }]
  }, {
    label: '二级 3-2', level: 2,
    children: [{
      label: '三级 3-2-1', level: 3,
    }]
  }]
  }
  , 
  {
  label: '一级 4', level: 1,
  }
]
</script>

Tree属性

属性说明类型可选值默认值
data需要展示的Tree数据TreeItem[]——[]

Tree事件

事件名说明参数
click点击单个树节点回调返回点击tree节点value