fix(readme): description with createWithEqualityFn (#1985)

* fix(readme): description with createWithEqualityFn

* fix wording

---------

Co-authored-by: Blazej Sewera <code@sewera.dev>
This commit is contained in:
Daishi Kato 2023-08-12 19:04:46 +09:00 committed by GitHub
parent 0426978490
commit 49d43b7ddd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -86,9 +86,22 @@ const honey = useBearStore((state) => state.honey)
If you want to construct a single object with multiple state-picks inside, similar to redux's mapStateToProps, you can tell zustand that you want the object to be diffed shallowly by passing the `shallow` equality function.
To use a custom equality function, you need `createWithEqualityFn` instead of `create`. Usually you want to specify `Object.is` as the second argument for the default equality function, but it's configurable.
```jsx
import { createWithEqualityFn } from 'zustand/traditional'
import { shallow } from 'zustand/shallow'
// Use createWithEqualityFn instead of create
const useBearStore = createWithEqualityFn(
(set) => ({
bears: 0,
increasePopulation: () => set((state) => ({ bears: state.bears + 1 })),
removeAllBears: () => set({ bears: 0 }),
}),
Object.is // Specify the default equality function, which can be shallow
)
// Object pick, re-renders the component when either state.nuts or state.honey change
const { nuts, honey } = useBearStore(
(state) => ({ nuts: state.nuts, honey: state.honey }),