Vue深入组件:递归组件

我们先把两个组件称为 A 和 B。模块系统发现它需要 A,但是首先 A 依赖 B,但是 B 又依赖 A,但是 A 又依赖 B,如此往复。这变成了一个循环,不知道如何不经过其中一个组件而完全解析出另一个组件。为了解决这个问题,我们需要给模块系统一个点,在那里“A 反正是需要 B 的,但是我们不需要先解析 B。”

”在我们的例子中,把 <tree-folder> 组件设为了那个点。我们知道那个产生悖论的子组件是 <tree-folder-contents>组件,所以我们会等到生命周期钩子 beforeCreate 时去注册它:“

beforeCreate: function () { this.$options.components.TreeFolderContents = require('./tree-folder-contents.vue').default }

或者,在本地注册组件的时候,你可以使用 webpack 的异步 import

components: {TreeFolderContents: () => import('./tree-folder-contents.vue')}

这样问题就解决了,建议使用后者方法

posted @ 2022-11-29 14:09  lijjj  阅读(144)  评论(0编辑  收藏  举报