组成概述

组合是一种管理复杂性和将代码组织成可重用片段的策略。 Lit 提供了一些用于组合和代码重用的选项

  • 组件组合。
  • 响应式控制器。
  • 类混入。

组件组合 是将复杂组件从更简单的组件组装起来的过程。 组件可以在其模板中使用子组件。 组件可以使用标准 DOM 机制进行通信:设置子组件的属性,以及监听子组件的事件。

虽然组件组合是将复杂的 Lit 项目分解成更小单元的默认方式,但还有另外两种值得注意的代码模式可用于分解你的 Lit 代码

响应式控制器 是可以挂钩到 Lit 组件更新生命周期的对象,将与功能相关的状态和行为封装到一个单独的代码单元中。

类混入 允许你编写可重用的部分组件定义并将它们“混入”组件的继承链。

混入和响应式控制器都允许你将与给定功能相关的组件逻辑分解成可重用单元。 请参阅下一节以比较控制器和混入。

控制器和类混入在某些方面非常相似。 它们都可以挂钩到主机组件的生命周期、维护状态和触发主机更新。

控制器和混入之间的主要区别在于它们与组件的关系。 组件与响应式控制器之间存在“拥有”关系,因为它拥有控制器。 组件与混入之间存在“是”关系,因为组件是混入类的实例。

响应式控制器是一个由组件拥有的独立对象。 控制器可以访问组件上的方法和字段,而组件可以访问控制器上的方法和字段。 但控制器不能(轻松地)被使用组件的人访问,除非组件向其公开一个公共 API。 控制器的生命周期方法在组件上的相应生命周期方法之前调用。

另一方面,混入成为组件原型链的一部分。 混入定义的任何公共字段或方法都是组件 API 的一部分。 由于混入是原型链的一部分,因此你的组件对何时调用混入的生命周期回调具有一定程度的控制。

一般来说,如果你试图决定是否将功能打包为控制器或混入,你应该选择控制器,除非该功能需要以下之一

  • 向组件添加公共 API。
  • 对组件生命周期进行非常细粒度的访问。