郑柏铃 5 napja
szülő
commit
53d0fa4bbd

+ 35 - 1
20.react/高阶/my-redux/src/store/index.js

@@ -1,8 +1,42 @@
 import { configureStore } from '@reduxjs/toolkit';
+import userReducer from './slice/user';
 
+/**
+ * 
+ * @param {*} state 
+ * @param {*} action 
+ * 
+ * state 用来存储所有的状态
+ * action 是一个对象
+ * type:必需的,通过type决定如何修改状态
+ * payload:可选的,用于传递参数
+ */
+const reducer1 = (state,action) => {
+    return {
+        user: {
+            name:"图图",
+            age:3
+        }
+    }
+}
+const reducer2 = (state,action) => {
+    return {
+        user: {
+            name:"蜡笔小新",
+            age:5
+        }
+    }
+}
+/**
+ * reducer:
+ * 可以是一个函数,,定义修改状态的方法和返回新状态;
+ * 可以是一个对象,里面包含了多个reducer函数合并成一个大的reducer函数
+ */
 const store = configureStore({
     reducer:{
-        
+        reducer1,
+        reducer2,
+        user2:userReducer
     }
 })
 

+ 14 - 0
20.react/高阶/my-redux/src/store/slice/user.js

@@ -0,0 +1,14 @@
+import {createSlice} from '@reduxjs/toolkit';
+
+const userSlice = createSlice({
+    // name:给action对象中的type属性指定命名
+    name: 'user1',
+    // initialState:指定初始状态值
+    initialState: {
+        name:'胡图图',
+        age: 3,
+        address: '翻斗花园'
+    }
+})
+
+export default userSlice.reducer;