【zustand】基本メモ

type.ts

export type OwnerState = {
    flowTitle: string;
    qNodeNum: number;
    setQnodeNum: (by: number) => void;

};

store

import { create } from "zustand";
import { OwnerState } from "./types";

export const useOwnerStore = create<OwnerState>((set) => ({
    flowTitle: "",
    qNodeNum: 0,

    setFlowTitle: (by: string) => set({ flowTitle: by }),
    addQnodeNum: (by: number) =>
        set((state) => ({ qNodeNum: state.qNodeNum + by })),
}));

コンポーネント

const setFlowTitle = useOwnerStore((state) => state.setFlowTitle);
const addQnodeNum = useOwnerStore((state) => state.addQnodeNum);