Skip to content

Commit 43376e7

Browse files
committed
add section on deep reactivity
1 parent 9f5df6f commit 43376e7

File tree

1 file changed

+13
-0
lines changed

1 file changed

+13
-0
lines changed

documentation/docs/02-runes/03-$derived.md

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,19 @@ Derived expressions are recalculated when their dependencies change, but you can
8383

8484
> [!NOTE] Prior to Svelte 5.25, deriveds were read-only.
8585
86+
## Deriveds and reactivity
87+
88+
Unlike `$state`, which converts objects and arrays to [deeply reactive proxies]($state#Deep-state), `$derived` values are left as-is. For example, [in a case like this](https://svelte.dev/playground/b0d5cb9ecb6c463fafb8976e06c9335f)...
89+
90+
```svelte
91+
let items = $state([...]);
92+
93+
let index = $state(0);
94+
let selected = $derived(items[index]);
95+
```
96+
97+
...you can change (or `bind:` to) properties of `selected` and it will affect the underlying `items` array. If `items` was _not_ deeply reactive, mutating `selected` would have no effect.
98+
8699
## Update propagation
87100

88101
Svelte uses something called _push-pull reactivity_ — when state is updated, everything that depends on the state (whether directly or indirectly) is immediately notified of the change (the 'push'), but derived values are not re-evaluated until they are actually read (the 'pull').

0 commit comments

Comments
 (0)