archive-gh-me/zustand
1
0
Fork 0
mirror of https://github.com/pmndrs/zustand.git synced 2025-12-08 19:45:52 +00:00
Code Issues Projects Releases Wiki Activity

Improve types in Immer middleware docs (#2139)

Browse Source 
* Having the generic type on `immer` makes you lose introspection in IDE's.

* Add note about parenthesis and link back to typescript guide.
This commit is contained in:
Bram Van der Sype 2023-10-23 01:44:10 +02:00 committed by GitHub
parent 83b86a716c
commit 643bb7ab11
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/guides/typescript.md
View File

@ -5,7 +5,7 @@ nav: 8
## Basic usage
The difference when using TypeScript is that instead of writing `create(...)`, you have to write `create<T>()(...)` (notice the extra parenthesis `()` too along with the type parameter) where `T` is the type of the state to annotate it. For example:
The difference when using TypeScript is that instead of writing `create(...)`, you have to write `create<T>()(...)` (notice the extra parentheses `()` too along with the type parameter) where `T` is the type of the state to annotate it. For example:
```ts
import { create } from 'zustand'

10
docs/integrations/immer-middleware.md
View File

@ -19,6 +19,8 @@ npm install immer
## Usage
(Notice the extra parentheses after the type parameter as mentioned in the [Typescript Guide](../guides/typescript.md)).
Updating simple states
```ts
@ -34,8 +36,8 @@ type Actions = {
decrement: (qty: number) => void
}
export const useCountStore = create(
immer<State & Actions>((set) => ({
export const useCountStore = create<State & Actions>()(
immer((set) => ({
count: 0,
increment: (qty: number) =>
set((state) => {
@ -69,8 +71,8 @@ type Actions = {
toggleTodo: (todoId: string) => void
}
export const useTodoStore = create(
immer<State & Actions>((set) => ({
export const useTodoStore = create<State & Actions>()(
immer((set) => ({
todos: {
'82471c5f-4207-4b1d-abcb-b98547e01a3e': {
id: '82471c5f-4207-4b1d-abcb-b98547e01a3e',