tree-view.vue 995 B

1234567891011121314151617181920212223242526272829303132333435
  1. <template>
  2. <view class="flex flex-col bg-white rounded-lg shadow shadow-blue-100 p-30">
  3. <tree-view-node v-for="node in treeData" :node="node" @node-click="handleNodeClick">
  4. <template v-for="(_, name) in $slots" #[name]="scope">
  5. <slot :name="name" v-bind="scope"/>
  6. </template>
  7. </tree-view-node>
  8. </view>
  9. </template>
  10. <script>
  11. import TreeViewNode from "@/pages/topic-center/index/components/tree-view-node.vue";
  12. import {empty} from "@/uni_modules/uv-ui-tools/libs/function/test";
  13. export default {
  14. name: 'tree-view',
  15. components: {TreeViewNode},
  16. emits: ['node-click', 'leaf-click'],
  17. props: {
  18. treeData: {
  19. type: Array,
  20. required: true,
  21. }
  22. },
  23. methods: {
  24. handleNodeClick({node, deep}) {
  25. this.$emit('node-click', {node, deep})
  26. if (empty(node.children)) this.$emit('leaf-click', {node, deep})
  27. }
  28. }
  29. };
  30. </script>
  31. <style scoped>
  32. </style>