Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit 08346b5

Browse filesBrowse files
authored
docs: move some $state information around (#15969)
1 parent 8e16c77 commit 08346b5
Copy full SHA for 08346b5

File tree

Expand file treeCollapse file tree

1 file changed

+6
-4
lines changed
Filter options
Expand file treeCollapse file tree

1 file changed

+6
-4
lines changed

‎documentation/docs/02-runes/02-$state.md

Copy file name to clipboardExpand all lines: documentation/docs/02-runes/02-$state.md
+6-4Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -20,9 +20,7 @@ Unlike other frameworks you may have encountered, there is no API for interactin
2020

2121
If `$state` is used with an array or a simple object, the result is a deeply reactive _state proxy_. [Proxies](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy) allow Svelte to run code when you read or write properties, including via methods like `array.push(...)`, triggering granular updates.
2222

23-
> [!NOTE] Class instances are not proxied. You can create [reactive state fields](#Classes) on classes that you define. Svelte provides reactive implementations of built-ins like `Set` and `Map` that can be imported from [`svelte/reactivity`](svelte-reactivity).
24-
25-
State is proxified recursively until Svelte finds something other than an array or simple object. In a case like this...
23+
State is proxified recursively until Svelte finds something other than an array or simple object (like a class). In a case like this...
2624

2725
```js
2826
let todos = $state([
@@ -67,7 +65,7 @@ todos[0].done = !todos[0].done;
6765

6866
### Classes
6967

70-
You can also use `$state` in class fields (whether public or private), or as the first assignment to a property immediately inside the `constructor`:
68+
Class instances are not proxied. Instead, you can use `$state` in class fields (whether public or private), or as the first assignment to a property immediately inside the `constructor`:
7169

7270
```js
7371
// @errors: 7006 2554
@@ -121,6 +119,8 @@ class Todo {
121119
}
122120
```
123121

122+
> Svelte provides reactive implementations of built-in classes like `Set` and `Map` that can be imported from [`svelte/reactivity`](svelte-reactivity).
123+
124124
## `$state.raw`
125125

126126
In cases where you don't want objects and arrays to be deeply reactive you can use `$state.raw`.
@@ -145,6 +145,8 @@ person = {
145145

146146
This can improve performance with large arrays and objects that you weren't planning to mutate anyway, since it avoids the cost of making them reactive. Note that raw state can _contain_ reactive state (for example, a raw array of reactive objects).
147147

148+
As with `$state`, you can declare class fields using `$state.raw`.
149+
148150
## `$state.snapshot`
149151

150152
To take a static snapshot of a deeply reactive `$state` proxy, use `$state.snapshot`:

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.