Skip to content

Commit d0ff6bb

Browse files
Update classlist.mdx (#1099)
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
1 parent ceaa825 commit d0ff6bb

File tree

1 file changed

+2
-2
lines changed

1 file changed

+2
-2
lines changed

src/routes/reference/jsx-attributes/classlist.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,12 +37,12 @@ The value passed into `classList` can be any expression (including a signal gett
3737

3838
```tsx
3939
// Dynamic class name and value
40-
;<div classList={{ [className()]: classOn() }} />
40+
<div classList={{ [className()]: classOn() }} />
4141

4242
// Signal class list
4343
const [classes, setClasses] = createSignal({})
4444
setClasses((c) => ({ ...c, active: true }))
45-
;<div classList={classes()} />
45+
<div classList={classes()} />
4646
```
4747

4848
It's also possible, but dangerous, to mix class and classList. The main safe situation is when class is set to a static string (or nothing), and classList is reactive. (class could also be set to a static computed value as in `class={baseClass()}`, but then it should appear before any classList pseudo-attributes.) If both class and classList are reactive, you can get unexpected behavior: when the class value changes, Solid sets the entire class attribute, so will overwrite any toggles made by classList.

0 commit comments

Comments
 (0)