useStylesScoped() - 作用域样式

在前面的部分中,我们讨论了如何使用 useStyles$() 钩子在需要时延迟加载样式。浏览器样式是全局的,适用于所有 DOM 元素,为此,Qwik 还提供了一种方法来加载特定于特定组件的样式。这是通过为每个组件生成一个唯一的类,然后将该唯一的类 ID 插入样式表来实现的。

使用 useStylesScoped$() 将样式加载并限定到特定组件。

示例

在这个示例中,有两个组件,它们都具有相同名称的类。因此,这两种样式会发生冲突,导致不希望的行为。使用 useStylesScoped$() 钩子将样式限定到特定组件,并解决冲突。

编辑教程