diff --git a/src/routes/reference/jsx-attributes/classlist.mdx b/src/routes/reference/jsx-attributes/classlist.mdx index fdc57035d..63808af63 100644 --- a/src/routes/reference/jsx-attributes/classlist.mdx +++ b/src/routes/reference/jsx-attributes/classlist.mdx @@ -37,12 +37,12 @@ The value passed into `classList` can be any expression (including a signal gett ```tsx // Dynamic class name and value -;
+
// Signal class list const [classes, setClasses] = createSignal({}) setClasses((c) => ({ ...c, active: true })) -;
+
``` 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.