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

docs: add migration example in v3 create context (#1524)

Browse Source 
* docs: add migration example in v3 create context

* fix markdown

* minor fix
This commit is contained in:
Daishi Kato 2023-01-10 21:54:30 +09:00 committed by GitHub
parent 013a1ca5ff
commit 55d0c3aec9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 28 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
docs/previous-versions/zustand-v3-create-context.md
View File

@ -6,7 +6,7 @@ nav: 18
A special `createContext` is provided since v3.5,
which avoids misusing the store hook.
> **Note**: This function will be deprecated in v4 and removed in v5.
> **Note**: This function is deprecated in v4 and will be removed in v5. See [Migration](#migration).
```jsx
import create from 'zustand'
@ -102,3 +102,30 @@ export default function App({ initialBears }) {
)
}
```
## Migration
Discussion: https://github.com/pmndrs/zustand/discussions/1276
Here's the diff showing how to migrate from v3 createContext to v4 API.
```diff
// store.ts
+ import { createContext, useContext } from "react";
- import create from "zustand";
- import createContext from "zustand/context";
+ import { createStore, useStore } from "zustand";
- const useStore = create((set) => ({
+ const store = createStore((set) => ({
bears: 0,
increasePopulation: () => set((state) => ({ bears: state.bears + 1 })),
removeAllBears: () => set({ bears: 0 })
}));
+ const MyContext = createContext()
+ export const Provider = ({ children }) = <MyContext.Provider value={store}>{children}</MyContext.Provider>;
+ export const useMyStore = (selector) => useStore(useContext(MyContext), selector);
```