treeselect标签展示数据

treeselect标签可以用来展示树形结构的数据，它可以根据数据源自动生成树形结构，并且提供搜索功能。以下是一个使用treeselect标签展示数据的示例：

<template>
  <div>
    <treeselect v-model="selectedNode" :options="treeData" :searchable="true" />
  </div>
</template>

<script>
import Treeselect from '@riophae/vue-treeselect'

export default {
  components: {
    Treeselect
  },
  data() {
    return {
      selectedNode: null,
      treeData: [
        {
          id: 1,
          label: 'Node 1',
          children: [
            {
              id: 2,
              label: 'Node 1.1'
            },
            {
              id: 3,
              label: 'Node 1.2'
            }
          ]
        },
        {
          id: 4,
          label: 'Node 2',
          children: [
            {
              id: 5,
              label: 'Node 2.1'
            },
            {
              id: 6,
              label: 'Node 2.2'
            }
          ]
        }
      ]
    }
  }
}
</script>

在上面的示例中，我们引入了@riophae/vue-treeselect库并注册了一个Treeselect组件。在data中定义了treeData数组，它包含了树形结构的数据，其中每个节点都有一个id和label属性，children属性用于表示子节点。将treeData数组传递给Treeselect的options属性，Treeselect会根据数据源自动生成树形结构。使用v-model指令绑定selectedNode属性，可以获取当前选中的节点。设置searchable属性为true，可以启用搜索功能。