fix:react

20.react/高阶/my-redux/src/pages/My.jsx

@@ -1,7 +1,19 @@
+import { useSelector,useDispatch } from "react-redux";
+import {setName} from '../store/slice/user';
 function My() {
+    // useSelector 获取状态中所有的字段 但需要将具体的字段解析
+    const userMsg = useSelector(({user2}) => user2)
+    const dispatch = useDispatch()
+    console.log(userMsg)
     return (
         <div>
             <h1>My</h1>
+            <p>
+                我叫{userMsg.name},今年{userMsg.age}岁,我家住在{userMsg.address}
+            </p>
+            <button onClick={()=>{
+                dispatch(setName('蜡笔小新'))
+            }}>修改名字</button>
         </div>
     )
 }

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

@@ -8,7 +8,19 @@ const userSlice = createSlice({
         name:'胡图图',
         age: 3,
         address: '翻斗花园'
+    },
+    // 方法:存放该切片中定义的各种修改状态的reducer函数
+    reducers: {
+        setName(state,{payload}) {
+            // console.log(state,action)
+            // state.name = action.payload;
+            state.name = payload;
+        }
     }
 })
 
-export default userSlice.reducer;
+export default userSlice.reducer;
+
+// 在slice对象中 有一个actions属性 类型是对象 
+// 存储所有reducer函数中的对象构建的方法
+export const {setName} = userSlice.actions;