valtio-define 1.3.1 → 1.3.2
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 +8 -25
- package/dist/index.mjs +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -42,43 +42,26 @@ const store = defineStore({
|
|
|
42
42
|
this.count++
|
|
43
43
|
},
|
|
44
44
|
},
|
|
45
|
+
getters: {
|
|
46
|
+
doubled() {
|
|
47
|
+
return this.count * 2
|
|
48
|
+
},
|
|
49
|
+
},
|
|
45
50
|
})
|
|
46
51
|
|
|
47
52
|
function Counter() {
|
|
48
|
-
const { count } = useStore(store)
|
|
53
|
+
const { count, doubled } = useStore(store)
|
|
49
54
|
|
|
50
55
|
return (
|
|
51
56
|
<div>
|
|
52
|
-
<div>
|
|
53
|
-
Count:
|
|
54
|
-
{count}
|
|
55
|
-
</div>
|
|
56
57
|
<button onClick={store.increment}>Increment</button>
|
|
58
|
+
<div>Count: {count}</div>
|
|
59
|
+
<div>Doubled: {doubled}</div>
|
|
57
60
|
</div>
|
|
58
61
|
)
|
|
59
62
|
}
|
|
60
63
|
```
|
|
61
64
|
|
|
62
|
-
### Derived State (Getters)
|
|
63
|
-
|
|
64
|
-
Getters are **computed properties**. They automatically re-evaluate when their dependencies change, providing a clean way to derive data.
|
|
65
|
-
|
|
66
|
-
```tsx
|
|
67
|
-
const store = defineStore({
|
|
68
|
-
state: () => ({ count: 0 }),
|
|
69
|
-
getters: {
|
|
70
|
-
doubled() {
|
|
71
|
-
return this.count * 2
|
|
72
|
-
},
|
|
73
|
-
},
|
|
74
|
-
actions: {
|
|
75
|
-
increment() {
|
|
76
|
-
this.count++
|
|
77
|
-
},
|
|
78
|
-
},
|
|
79
|
-
})
|
|
80
|
-
```
|
|
81
|
-
|
|
82
65
|
-----
|
|
83
66
|
|
|
84
67
|
## 🛠 Advanced Features
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{proxy as e,useSnapshot as t}from"valtio";import{batch as n
|
|
1
|
+
import{proxy as e,useSnapshot as t}from"valtio";import{batch as n}from"valtio-reactive";import{$ as r}from"valtio-signal";import{subscribeKey as i}from"valtio/utils";import{proxy as a,ref as o,subscribe as s}from"valtio/vanilla";const c=e([]);function l(e){c.push(e)}function u(e){let t=typeof e.state==`function`?e.state():e.state,l=e.getters||{},u=e.actions||{},f=a(t),p={},m=a({}),h=new WeakSet,g;for(let e of Object.keys(l))d(f,e,l[e].bind(f),{enumerable:!1}),d(m,e,()=>f[e]);for(let e of Object.keys(u))p[e]=o(u[e].bind(f)),d(f,e,()=>p[e],{enumerable:!1});function _(e){return s(f,t=>e(f,t))}function v(e,t){return i(f,e,e=>t(e),!0)}function y(e){typeof e==`function`?n(()=>e(f)):Object.assign(f,e)}function b(e){return e(r(f))}function x(){g?.()}function S(e){T(e)}let C={$subscribe:_,$subscribeKey:v,$patch:y,$state:f,$actions:p,$getters:m,$dispose:x,$signal:b,use:S},w=new Proxy(C,{get(e,t){return t in p?p[t]:t in e?e[t]:f[t]},has(e,t){return t in e||t in p||t in f},set(e,t,n){return t in f?f[t]=n:e[t]=n,!0}});function T(t){h.has(t)||(h.add(t),t({store:w,options:e}))}for(let e of c)T(e);return g=s(c,()=>{for(let e of c)T(e)}),w}function d(e,t,n,r){Object.defineProperty(e,t,{get:n,enumerable:!0,...r})}function f(e,n){return t(e.$state,n)}function p(e,n){return t(e.$getters,n)}function m(e,t,n){let r=f(e,n);function i(n){typeof n==`function`?e.$patch(e=>{e[t]=n(e[t])}):e.$patch(e=>{e[t]=n})}return[r[t],i]}function h(e,t){return Object.fromEntries(Object.keys(e.$state).map(n=>[n,m(e,n,t)]))}var g={use:l};export{g as default,u as defineStore,c as plugins,m as storeToState,h as storeToStates,l as use,p as useGetters,f as useStore};
|
package/package.json
CHANGED