Movatterモバイル変換


[0]ホーム

URL:


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

Sign up
Appearance settings

Commit45bbcfa

Browse files
committed
docs: improve updating state docs and remove redundant
1 parent5ddcba2 commit45bbcfa

File tree

3 files changed

+22
-32
lines changed

3 files changed

+22
-32
lines changed

‎apps/docs/pages/service/overview.mdx‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎apps/docs/pages/service/trpc-usage-example.mdx‎

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎apps/docs/pages/store/updating-state.mdx‎

Lines changed: 22 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -112,26 +112,35 @@ userStore.address.assign({
112112

113113
Note: the`assign` method only exists on object data type
114114

115-
##Using setwithCallbacks
115+
##Setwithcallback functions
116116

117-
When passing a callback to to the`set` function, the type of callback you need to pass depends on the state datatype.
117+
The`set` function can accept a value or a callback function
118118

119-
The types fully reflect which type of callback is required and therefore your IDE guide you.
119+
Set value example:`counterStore.set(5)`
120+
Set callback function example:`counterStore.set(()=>{...})`
120121

121-
###using`set(draft=>{})` with objects/arrays
122+
###Datatype differences summary
123+
124+
The type of callback function changes depending on the state datatype.
125+
126+
**Objects/Arrays**: directly modify the draft, don't return anything
127+
**Primitives**: get previous value, return new value
128+
129+
(The types fully reflect which type of callback is required and therefore your IDE will guide you.)
130+
131+
###Object / Array set callback details
122132

123133
Calling`.set` on an object/array uses immer under the hook, allowing you to mutate a draft copy of the state while maininaining immutability.
124134

125135
```tsx
126136
const userStore=store({ name:'John', age:20 });
127137

128-
//settings objects uses immer
138+
//draft object uses immer
129139
userStore.set((draft)=> {
130140
draft.name='Jane';
131141
draft.age=30;
132142
});
133143

134-
//
135144
const todosStore=store([
136145
{ id:1, text:'write docs' },
137146
{ id:2, text:'sleep' },
@@ -141,35 +150,24 @@ todosStore.set((draft) => {
141150
draft.push('another task');
142151
});
143152

144-
todosStore.set(draft=>{
145-
cosntfirstTodo=todosStore[0];
146-
firstTodo.text="new text"
147-
})
153+
todosStore.set((draft)=>{
154+
const firstTodo=draft[0];
155+
firstTodo.text='new text';
156+
});
148157
```
149158

150-
###Using `set(preValue=>...) with primatives
159+
###Primitivesset callback details
151160

152161
Calling`set` on other data types behaves slightly differently.
162+
153163
You are given the previous value of the property and you must return the new value from the callback.
154164

155165
```tsx
156166
userStore.age.set((prevAge)=>prevAge+1);
157167
```
158168

159-
###Key differences between using set callback
160-
161-
- objects/arrays:
162-
163-
- you can directly modify the draft and you dont need to return anything
164-
165-
- primative values:
166-
167-
- gets the previous value of the property, you must return the new value from the callback
168-
169169
##Additional notes:
170170

171-
-calling`.set(value)` on arrays/object behaves the same as othervalues. The difference only arises when passing a callback to the`set` function.
171+
-Non-draftablevalues (e.g., MediaRecorder or window) will be considered as primitive values
172172

173173
- Since`@davstack/store 1.3.0` root level array stores are fully supported
174-
175-
- You no longer need to consider the limitations of immer as non-draftable values eg MediaRecorder or window will default to regular zustand setters.

0 commit comments

Comments
 (0)

[8]ページ先頭

©2009-2025 Movatter.jp