| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263 |
- <template>
- <treeList
- v-for="model in list"
- v-bind="$attrs"
- :model="model"
- :key="model.id"
- @detail-node="onDetail"
- >
- <template #icon="slotProps">
- <slot name="icon" v-bind="slotProps"></slot>
- </template>
- <template #operation="slotProps">
- <slot name="operation" v-bind="slotProps"></slot>
- </template>
- </treeList>
- </template>
- <script setup lang="ts">
- import { ref } from 'vue';
- import treeList from './treeList.vue';
- const emit = defineEmits([ 'detailNode']);
- interface IFileSystem {
- id: string;
- title: string;
- pid: string;
- isFolder: boolean;
- isAdd: boolean;
- children?: IFileSystem[];
- }
- const props = withDefaults(
- defineProps<{
- list: IFileSystem[];
- }>(),
- {}
- );
- // 递归寻找父组件
- function findParent(pid, Tree) {
- let targetNode = null;
- function find(item, flattenTree) {
- flattenTree.find((ele) => {
- if (ele.id == pid) {
- targetNode = ele;
- return true;
- } else {
- if (ele.children) {
- find(pid, ele.children);
- }
- }
- });
- }
- find(pid, Tree);
- return targetNode.children;
- }
- // 删除
- const onDetail = (node) => {
- emit('detailNode', {
- ...node,
- eventType: 'detail',
- });
- };
-
-
- </script>
- <style scoped></style>
|