0

Zustand & Nextjs 14

  • Sử dụng persist và không persist , chia slice persist cần thiết.
  • Sử dụng devtools redux.
import { create } from 'zustand';
import { devtools, persist } from 'zustand/middleware';
import { authSlice } from './auth';
import { blogSlice } from './blog';
import { cinemaSlice } from './cinema';
import { jsonSlice } from './ejson';
import { envSlice } from './env';
import { postSlice } from './post';
import { settingSlice } from './setting';
import { todoSlice } from './todo';

type State = ReturnType<typeof jsonSlice> &
    ReturnType<typeof postSlice> &
    ReturnType<typeof todoSlice> &
    ReturnType<typeof blogSlice> &
    ReturnType<typeof cinemaSlice>;

type StatePersist = ReturnType<typeof envSlice> &
    ReturnType<typeof settingSlice> &
    ReturnType<typeof authSlice>;

export const sStore = create<State & StatePersist>()(
    devtools((...a) => ({
        ...jsonSlice(...a),
        ...postSlice(...a),
        ...todoSlice(...a),
        ...blogSlice(...a),
        ...cinemaSlice(...a),
        ...cinemaSlice(...a),
        ...persist<StatePersist>(
            (...a) => {
                return {
                    ...settingSlice(...a),
                    ...envSlice(...a),
                    ...authSlice(...a),
                };
            },
            {
                name: 'store',
                version: 1,
            }
        )(...a),
    }))
);


All rights reserved

Bình luận

Đăng nhập để bình luận
Avatar
0
Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí