Skip to content
主题色
灰色
夜间模式组件大小小(1)中(2)大(3)组件圆角
none
small
medium
large
full
组件缩放90%95%100%105%110%

对于某些需要Teleport的组件(如message, popover, select等),如果它们直接往 body 渲染节点,则无法使用组件本身 shadowRoot 下的样式。而l-teleport-holder便相当于一个容器,为这些组件的节点提供存放位置并提供样式

  • 该组件为内部自动创建使用,你不应该手动使用它。每个有Teleport功能的组件都会有一个to属性,用于指定渲染位置,若不指定则默认创建到第一个l-theme-provider元素下
ts
type Props = {
  to?: MaybeRefLikeOrGetter<string | HTMLElement>;
};
  • 被 Teleported 的内容会被特殊处理,其仍然会继承原先所在位置的状态,例如 EditState、主题等等
  • 其默认为 fixed 定位,z-index可在GlobalContextConfig中配置
  • 对于那些被 Teleport 的组件,l-teleport-holder只提供了它们在全局静态/动态配置中的样式,它们原节点本身的innerStyle无法生效
  • 需要注意的是,被 Teleport 的节点如果包含 slot,则该组件的这个插槽将无法使用,具体有哪些请参考各个组件(例如 popover 的 pop-content 插槽)

继承