Skip to content

Commit

Permalink
Create witty-games-raise.md
Browse files Browse the repository at this point in the history
  • Loading branch information
zbeyens authored Apr 22, 2022
1 parent d68a3f6 commit c66963c
Showing 1 changed file with 33 additions and 0 deletions.
33 changes: 33 additions & 0 deletions .changeset/witty-games-raise.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
---
"@udecode/zustood": minor
---

`react-tracked` support

Use the tracked hooks in React components, no providers needed. Select your
state and the component will trigger re-renders only if the **accessed property** is changed. Use the `useTracked` method:

```tsx
// Global tracked hook selectors
export const useTrackedStore = () => mapValuesKey('useTracked', rootStore);

// with useTrackStore UserEmail Component will only re-render when accessed property owner.email changed
const UserEmail = () => {
const owner = useTrackedStore().repo.owner()
return (
<div>
<span>User Email: {owner.email}</span>
</div>
);
};
// with useStore UserEmail Component re-render when owner changed, but you can pass equalityFn to avoid it.
const UserEmail = () => {
const owner = useStore().repo.owner()
// const owner = useStore().repo.owner((prev, next) => prev.owner.email === next.owner.email)
return (
<div>
<span>User Email: {owner.email}</span>
</div>
);
};
```

0 comments on commit c66963c

Please sign in to comment.