vue3.0 组件互相嵌套不能渲染，有解吗？

[dinggk]

组件 A 中引用组件 B，
B 中又引用 A，
页面 C 中引用 A，
此时页面不能正常渲染。
请教大佬们，有解吗？

另：复制 A 文件为 A2, 在 B 中引用 A2，
则能正常渲染。

[fengxianqi]

如果没有终止条件不就无限引用了？建议可以从设计上调整这种嵌套策略

[faceRollingKB]

额，A 、B 都注册到全局可以渲染么？我遇到过更奇葩的问题，同一个组件在 A 里面可以渲染，但在有弹窗的 B 里面无法渲染，去掉弹窗和注册到全局都可以解决

[duanxianze]

全局注册 不过出现这种情况说明设计思路有问题

[murongxdb]

这不是循环引用了吧，这样的代码是很可怕的，建议不要这样写

[LongMaoz]

你用一面镜子对着另一面镜子？

[dinggk]

谢谢各位！
解释一下应用场景：
组件 A 是一个 Grid 列表组件，
组件 B 是一个 表单组件。
列表组件中包含 B 组件用于编辑，
表单组件 B 中又会引用 A 显示一个 Grid 列表。
我觉得这个设计不算很特殊吧？

[Ritr]

这属于循环引用了，设计上应该规避掉

[otakustay]

其实挺常见的不是，比如说：
1. 用户列表可以通过 subrow 展开用户的详细信息（ UserList -> UserInfo ）
2. 用户信息里要展示一个关联用户的列表（ UserInfo -> UserList ）

[SoulDee]

你说的依赖只是在页面逻辑上存在列表嵌套表单，表单又嵌套列表。通过插槽来写应该是没有问题的，但是你的设计是直接将嵌套集成到组件当中了。

我说的再清楚点。你的设计是下面这样，也就是实际就用了组件 A

组件 A （包含了组件 B ），组件 B （包含了组件 A ）；
应用:
<A></A>

插件化，嵌套是在外层使用，而不是集成到组件中
组件 A （仅提供 grid 容器，有 slot 插槽），组件 B （仅提供表单容器和相应表单逻辑，有 slot 插槽）
应用：
<A>
<B>
<A><B></B></A>
</B>
</A>

[codespots]

@SoulDee 我觉得你说的是对的

[yaphets666]

循环引用多出现在制作"菜单"组件的时候,注意一定要有出口.也就是终止循环引用的条件. 理论上循环引用是没有问题的.也不是设计错误.反而是一种高阶技巧.

[lin07hui]

使用 A2 渲染也是不正常，会报 [Vue warn]: Failed to resolve component: B at <A2> at <B> at <A> at <App> ，说明在 A2 时不会去渲染 B 。
我想你要的结果是：A 中有 B，B 中 A2，A2 中不需要 B 。
方法：列表组件不需要引用表单组件，使用 slot 渲染。表单组件引用列表组件。再添加一个可编辑列表组件，这个组件引用列表组件和表单组件

[no1xsyzy]

不就是递归吗？有什么可怕的？
强耦合不要分文件（甚至不要分两个组件，直接调用自己就成了）
弱耦合用插槽化把递归提升到父层

[Hilong]

注意递归的结束条件就行了，肯定要有个约束的啊

[fool079]

这种注册为全局组件就可以了

[HugoV]

可以试试异步引入
components: { A: () => import('A.vue') } 这样的写法

[feilaoda]

<A><slot></slot></A>

<B><slot></slot></B>

不应该这样设计么？管你嵌套不嵌套呢

[ddllzz]

#16 是可行的

[aheadin]

嵌套组件选择器：>>>
不推荐多用

[aheadin]

@aheadin 不好意思，看错了～