组件拆分思路,如何把一个复杂的组件拆分成嵌套组件?

之前项目中有很多相同的列表页,列表页包含了查询条件区域,批量操作区域 和 表格区域,所以我把整个内容都封装到了一个组件,现在因为 table 组件需要单独出来,所以我想把整个组件拆分成两个组件——list-page、mytable,list-page 引用 mytable,然后其他页面也可以引用 mytable 组件,其中 list-page 逻辑比较少(props、listeners的事件也少),但是 mytable 逻辑比较复杂,有很多的 props 、 listeners 和 slot

也就是说需要满足如下引用关系:

父组件 ——》 子组件 ——》孙子组件
页面应用组件——》list-page——》mytable

或者

父组件 ——》 子组件
页面应用组件——》mytable

在第一种(页面应用组件——》list-page——》mytable)引用关系下,可以通过 props 、 listeners 特性了满足 父组件——》孙子组件 之间的通讯,但是,孙子组件里面的 slot 在父组件里面却不能被正确使用,因为他的 slot 是应该他的父组件 list-page 来填充的,所以在 页面应用组件 中无法使用,请问该怎么处理这种问题?

待解决 悬赏分:0 - 离问题结束还有
反对 0举报 0 收藏 0

我来回答

回答1