For questions regarding Zustand, a hook-based state management system for React.
A small, fast and scalable bearbones state-management solution using simplified flux principles. Has a comfy API based on hooks, isn't boilerplatey or opinionated.
Questions tagged [zustand]
231 questions
0
votes
1 answer
How to use StoreApi in zustand
From the docs of zustand I found that together with set and get parameters they provide an additional parameter at StateCreator, called api.
Example bellow
import create, { StateCreator } from 'zustand'
import type { Store } from…
Yana Trifonova
- 586
- 7
- 28
0
votes
1 answer
How to use setState function synchronously in zustand?
There are parts of my app that must work synchronously. I am using zustand. The problem is that zustand's setState function works asynchronously. Please let me know if there are any other libraries that support synchronous state changes or any…
user17692924
- 11
- 5
0
votes
0 answers
React Logic / Dependency issue: Call a 3rd party API, get a batch of 100+ JSON entities, and CRUD store every 20~ seconds
I'm looking to accomplish this in a low overhead way, but I'm also looking to learn what the best practice would be.
I have React / Zustand / Immer app, that calls a 3rd party API every 20~ seconds that returns JSON with 100~ entities in…
Joe Fitzsimmons
- 1,043
- 1
- 8
- 22
0
votes
0 answers
Application state architecture: how to structure state with similar properties?
I have a state headerState that controls two UI elements: Mobile navbar and Auth dialog.
Mobile navbar and auth dialog both have properties isOpen, open and close
I need to come up with a flexible and extendible solution on how to structure the…
PYTHON DEVELOPER999
- 301
- 2
- 12
0
votes
0 answers
React Radio input selection persists on re-render
I am rendering a component including radio inputs. When a radio input selection is made, and the change is updated in state (Zustand if it matters), the component re-renders.
However, the radio selection is persisted on the re-render. Why is this…
Bradley Dong
- 11
- 1
0
votes
0 answers
How to avoid self referring an object in Typescript?
I have this kind of code:
// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
export const useStore = create((set, get) => {
const jwtClient = createJWTClient(useStore);
return {
dummyState:…
entropyfeverone
- 1,052
- 2
- 8
- 20
0
votes
1 answer
How to show an error to the user using react and zustand stores
I have the following problem. How should I show an error to the user using a zustand for storing my data? I have a function showError that I am using through my react application to show an error. The idea is I pass an error message and a toast is…
Spongi
- 501
- 3
- 10
- 19
0
votes
1 answer
How to add child entities without id to parent in state normalized with normalizr
I've recently started using normalizr with zustand in a new React app. It's been a very good experience so far, having solved most of the painful problems I've had in the past.
I've just bumped into an issue I can't think of a clean way of solving…
Delyan Peev
- 31
- 3
0
votes
1 answer
Zustand: change value of parameter in stored object
I am trying to create a function for a state of rated movies in Zustand.
The state consists of an array of objects, example with two entries:
ratedMovies: [
{ imdbID: "tt0076759", userRating: "5" },
{ imdbID: "tt0080684", userRating: "10"…
bysiuxvx
- 65
- 2
- 10
0
votes
0 answers
How to call function as a variable value in Typescript?
I have following code,
import create from "zustand";
import { useAuth } from "react-oidc-context";
import UserService from "../../services/authentication/userService";
type UserStore = {
role: string,
setRole: () => void
}
const auth =…
tickwave
- 3,335
- 6
- 41
- 82
0
votes
1 answer
Can't update Zustand state using setState function
In Comp1 when i hover mouse on it i want the state to change to true (I'm passing true param to it). Also i want to ensure that by doing so this will not cause the Comp2 component to re-render.
My understanding was that if i do like so…
Marius
- 1,664
- 2
- 16
- 28
0
votes
1 answer
How do Toggle using Zustand
I have created the following store using Zustand:
import create from "zustand"
const useStore = create((set) => ({
show: false,
toggleShow: () => set((state) => ({ show: !state.show })),
}))
I assumed that this would be the correct way to…
Moshe
- 6,011
- 16
- 60
- 112
0
votes
0 answers
How to set TypeScript function parameter type to return type?
I am defining a zustand store (library irrelevant for this question) and would like to avoid maintaining a separate type or interface for that store, so I'm trying to infer it from the return type of my initial store:
export const useStore =…
Ferdinand Torggler
- 1,304
- 10
- 11
0
votes
1 answer
can't synchronise the updated Products List array in zustand?
I want to explain the use case i have so you can understand it well
I have Cart & Products when the user adds the product (product_id = 1) twice to the cart and the product has the same options (red, xl) I increment the quantity,
if the user adds…
Oliver D
- 2,579
- 6
- 37
- 80
0
votes
0 answers
Zustand state does not re-render component or passes data correctly to then display filtered items
I'm using Zustand to store state, everything is working fine apart from this. When i click on the Song Buttons i want that to filter from the list.
Currently on fresh load it displays 3 songs. When clicking the button it should filter (and it does…
Marius
- 1,664
- 2
- 16
- 28