File tree Expand file tree Collapse file tree
src/routes/reference/jsx-attributes Expand file tree Collapse file tree Original file line number Diff line number Diff line change @@ -27,17 +27,19 @@ description: >-
2727
2828## Value
2929
30- - ** Type:** ` Record<string, boolean | undefined | null > `
30+ - ** Type:** ` Record<string, boolean | undefined> `
3131
3232Object whose keys are class names and whose values control whether each class is present.
3333
3434## Behavior
3535
3636- Each key is treated as a class name.
37+ - Keys can contain multiple space-separated class names, which are toggled individually.
3738- Truthy values add the class and falsy values remove it.
3839- Updates are applied per class rather than replacing the whole ` class ` attribute.
39- - ` classList ` is a compile-time pseudo-attribute and does not work through prop spreads or ` <Dynamic> ` .
40+ - ` classList ` works through normal DOM prop assignment, including prop spreads and ` <Dynamic> ` when it renders an intrinsic element .
4041- If both ` class ` and ` classList ` are reactive, updates to ` class ` can overwrite classes managed by ` classList ` .
42+ - SSR output merges ` class ` , ` className ` , and ` classList ` into the emitted ` class ` attribute.
4143
4244## Examples
4345
@@ -56,4 +58,8 @@ Object whose keys are class names and whose values control whether each class is
5658
5759``` tsx
5860<div classList = { { [className ()]: classOn () }} />
59- ```
61+ ```
62+
63+ ## Related
64+
65+ - [ ` class ` ] ( /reference/jsx-attributes/class )
You can’t perform that action at this time.
0 commit comments