mobx-react-use-autorun 4.0.3 → 4.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +32 -36
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -28,8 +28,35 @@ Provide concise usage for mobx in react<br/>
|
|
|
28
28
|
</div>
|
|
29
29
|
})
|
|
30
30
|
|
|
31
|
-
|
|
32
|
-
|
|
31
|
+
useMobxState provides two usages.<br/>
|
|
32
|
+
|
|
33
|
+
The first way is easy to use, you can define state, props and third-party hooks.<br/>
|
|
34
|
+
|
|
35
|
+
useMobxState({
|
|
36
|
+
name: 'tom',
|
|
37
|
+
age: 16,
|
|
38
|
+
myInfo(){
|
|
39
|
+
return `${state.name}'s age is ${state.age}`
|
|
40
|
+
},
|
|
41
|
+
}, {
|
|
42
|
+
...props,
|
|
43
|
+
intl: useIntl(),
|
|
44
|
+
})
|
|
45
|
+
|
|
46
|
+
The second way provide a method to generate state, the state is executed only once, and the performance is better.<br/>
|
|
47
|
+
|
|
48
|
+
useMobxState(() => ({
|
|
49
|
+
name: 'tom',
|
|
50
|
+
age: 13,
|
|
51
|
+
myInfo(){
|
|
52
|
+
return `${state.name}'s age is ${state.age}`
|
|
53
|
+
},
|
|
54
|
+
}), {
|
|
55
|
+
...props,
|
|
56
|
+
intl: useIntl(),
|
|
57
|
+
})
|
|
58
|
+
|
|
59
|
+
More example - Form validation:<br/>
|
|
33
60
|
|
|
34
61
|
import { Button, TextField } from '@mui/material';
|
|
35
62
|
import { observer, useMobxState } from 'mobx-react-use-autorun';
|
|
@@ -78,38 +105,6 @@ Form validation<br/>
|
|
|
78
105
|
</div>)
|
|
79
106
|
})
|
|
80
107
|
|
|
81
|
-
useMobxState provides two usages.<br/>
|
|
82
|
-
|
|
83
|
-
The first:
|
|
84
|
-
|
|
85
|
-
useMobxState({
|
|
86
|
-
name: 'tom',
|
|
87
|
-
age: 16,
|
|
88
|
-
myInfo(){
|
|
89
|
-
return `${state.name}'s age is ${state.age}`
|
|
90
|
-
},
|
|
91
|
-
}, {
|
|
92
|
-
...props,
|
|
93
|
-
intl: useIntl(),
|
|
94
|
-
})
|
|
95
|
-
|
|
96
|
-
is easy to use, you can define state, props and third-party hooks.<br/>
|
|
97
|
-
|
|
98
|
-
The second:
|
|
99
|
-
|
|
100
|
-
useMobxState(() => ({
|
|
101
|
-
name: 'tom',
|
|
102
|
-
age: 13,
|
|
103
|
-
myInfo(){
|
|
104
|
-
return `${state.name}'s age is ${state.age}`
|
|
105
|
-
},
|
|
106
|
-
}), {
|
|
107
|
-
...props,
|
|
108
|
-
intl: useIntl(),
|
|
109
|
-
})
|
|
110
|
-
|
|
111
|
-
Provide a method to generate state, the state is executed only once, and the performance is better.<br/>
|
|
112
|
-
|
|
113
108
|
### Subscription property changes with useMobxEffect
|
|
114
109
|
|
|
115
110
|
import { useMobxState, observer } from 'mobx-react-use-autorun';
|
|
@@ -284,10 +279,11 @@ Typedjson is a strongly typed reflection library.<br/>
|
|
|
284
279
|
const user = new TypedJSON(UserModel).parse(`{"username":"tom","createDate":"2023-04-13T04:21:59.262Z"}`);
|
|
285
280
|
console.log(toJS(user));
|
|
286
281
|
|
|
287
|
-
|
|
282
|
+
const anotherUser = new TypedJSON(UserModel).parse({
|
|
288
283
|
username: "tom",
|
|
289
284
|
createDate: "2023-04-13T04:21:59.262Z"
|
|
290
|
-
})
|
|
285
|
+
});
|
|
286
|
+
console.log(toJS(anotherUser));
|
|
291
287
|
|
|
292
288
|
# Learn More
|
|
293
289
|
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"mobx-react-use-autorun","version":"4.0.
|
|
1
|
+
{"name":"mobx-react-use-autorun","version":"4.0.5","description":"Provide concise usage for mobx in react","scripts":{"test":"npx -y -p typescript -p ts-node ts-node --skipProject bin/mobx_react_test.ts","build":"npx -y -p typescript -p ts-node ts-node --skipProject bin/mobx_react_build.ts","make":"npx -y -p typescript -p ts-node ts-node --skipProject bin/mobx_react_make.ts"},"dependencies":{"mobx":"6.9.0","mobx-react-lite":"3.4.3","rxjs":"7.8.1"},"peerDependencies":{"react":">=16.8.0"},"license":"MIT","keywords":["react","mobx","typescript","hooks"],"main":"./dist/cjs/index.js","module":"./dist/esm/index.js","es2015":"./dist/esm/index.js","types":"./dist/cjs/index.d.ts","eslintConfig":{"extends":["react-app","react-app/jest"]},"exports":{".":{"types":"./dist/cjs/index.d.ts","node":"./dist/cjs/index.js","require":"./dist/cjs/index.js","es2015":"./dist/esm/index.js","default":"./dist/esm/index.js"}},"homepage":"https://github.com/zdu-strong/mobx-react-use-autorun#readme","repository":{"type":"git","url":"git+https://github.com/zdu-strong/mobx-react-use-autorun.git"},"files":["lib","dist"],"bugs":{"url":"https://github.com/zdu-strong/mobx-react-use-autorun/issues"},"publishConfig":{"registry":"https://registry.npmjs.org/"}}
|