react18 中使用@reduxjs/toolkit

1.安装依赖包

yarn add @reduxjs/toolkit react-redux

2.创建 store

根目录下面创建 store 文件夹，然后创建 index.js 文件。

import { configureStore } from "@reduxjs/toolkit";
import { counterReducer } from "./features/counter";
import counterReducers from "./modules/counterStore";
import channelReducers from "./modules/channelStore";export const store = configureStore({reducer: {counterReducers,channelReducers,},middleware: (getDefaultMiddleware) => {const middlewares = getDefaultMiddleware();return [...middlewares /* ... */];},
});export default store;

3.创建模块

在 store 文件夹下面创建 modules 文件夹，然后创建 counterStore.js 和 channelStore.js 文件。

import { createSlice } from "@reduxjs/toolkit";
const counterSlice = createSlice({name: "counter",initialState: {count: 10,},reducers: {increase(state) {state.count += 1;},decrease(state) {state.count -= 1;},