redux-toolkit typescript initial setting

Bin2·2022년 7월 23일
0
post-custom-banner

Install

npm i redux-toolkit react-redux 
npm i -D @types/react-redux

Define Root State, Dispatch Types

import store from "../store/store";

export type RootState = ReturnType<typeof store.getState>;

export type AppDispatch = typeof store.dispatch;

// createAsyncThunk types
export type CreateAsyncThunkTypes = {
  dispatch: AppDispatch;
  state: RootState;
  rejectValue: string;
};

Define useDispatch, useSelector Types

import { useDispatch, useSelector } from "react-redux";
import { RootState } from "../types/storeTypes";
import type { TypedUseSelectorHook } from "react-redux";
import store from "../store/store";

export type AppDispatch = typeof store.dispatch;

export const useAppDispatch: () => AppDispatch = useDispatch;
export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector;

Define createSlice reducer Type

// postSlice.ts
export const postReducer: Reducer<typeof initialState> = postSlice.reducer;
profile
Developer
post-custom-banner

0개의 댓글