00
:
00
:
00
:
00
Corso SEO AI - Usa SEOEMAIL al checkout per il 30% di sconto

Creazione Store

create()

La funzione create accetta una funzione callback che riceve set, get e api. Ritorna un hook personalizzato (useStore).

TypeScript

Per una tipizzazione corretta:

```tsx import { create } from ‘zustand’

interface BearState { bears: number increase: (by: number) => void }

const useBearStore = create()((set) => ({ bears: 0, increase: (by) => set((state) => ({ bears: state.bears + by })), })) ```

Selettori (Performance)

Quando usi l’hook, è fondamentale passare un selettore. Se non lo passi (const state = useStore()), il componente si aggiornerà ad ogni cambiamento dello store, perdendo i vantaggi di performance.

```tsx // GOOD: Si aggiorna solo se ‘bears’ cambia const bears = useStore((state) => state.bears)

// BAD: Si aggiorna se cambia QUALSIASI cosa nello store const { bears } = useStore()

// Multiple selections (shallow) import { useShallow } from ‘zustand/react/shallow’ const { nuts, honey } = useStore( useShallow((state) => ({ nuts: state.nuts, honey: state.honey })), ) ```