vue 类似于百度云文件夹系统

clipboard.png

vue怎么实现百度云类似的文件夹系统,可以一级一级文件夹点下去,给个思路,Demo更好>_<

阅读 6.4k
4 个回答

每个文件夹的基础模型:

class Folder {
    String name;
    Array<Folder> children;
}

有需要的话,也要加上个Folder Parent的指针/引用。

如:

var files = {
    name: '最顶层',
    children: [
        {
            name: '电影',
            children: null
        },
        {
            name: '音乐',
            children: [{
                name: '杰伦',
                children: null
            }]
        }
    ]
}
<script>
export default {
    data () {
        currentFolder: files
    },
    methods: {
        next(index) {
            currentFolder = files.children[i]
        }
    }
}
</script>

<template>
    <folder-list v-if="currentFolder.children">
        <folder for="(f, i) in currentFolder.children" @click="nexe(i)">{f.name}</folder>
    </folder-list>
</template>

明白了,

clipboard.png

那这个怎么弄?

返回上一级,和点击哪层进哪层

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题