反应reduxcreateSlice或createReducer
我是初学者，不知道 createSlice 和 createReducer 有没有区别。
我应该选择哪个？
其次，我今天看了一个教程。这家伙刚刚制作了一个 store.js 文件和一个 userslice.js 文件。很简单。
但是他使它与 redux 文档有点不同。他在 userSlice.js 的末尾导出了三个 CONST，而不是文档中的两个。（我已经发表评论了）如果我将 state.user.user 更改为 state.user.wtf ......我会在一段时间后运行错误，因为某些组件不再访问用户对象了。
用户切片
import { createSlice } from '@reduxjs/toolkit';
export const userSlice = createSlice({
name: "user",
initialState: {
user: null,
},
reducers: {
login: (state, action) => {
state.user = action.payload;
},
logout: (state) => {
state.user = null;
},
},
});
export const { login, logout } = userSlice.actions;
export const selectUser = (state) => state.user.user; // What is that ? and why is it state.user and then a third user Object ???
export default userSlice.reducer;
在应用程序中。js 他做了那个命令
const user = useSelector(selectUser);
instead
const user = useSelector(state => state.user.user);
我真的不明白其中的区别
store.js 文件
import { configureStore } from '@reduxjs/toolkit';
import userReducer from '../features/userSlice'
export default configureStore({
reducer: {
user: userReducer,
},
});
有人可以向我解释一下吗。我感到很困惑
回答
在关于createSlice和createReducer问题的第一部分之后：
不知道createSlice 和createReducer 有没有区别。
一个很好的帮助来源是阅读 Redux Toolkit 文档，它说：
createSlice：一个函数，它接受一个初始状态、一个充满reducer函数的对象和一个“切片名称”，并自动生成与reducer和状态对应的动作创建者和动作类型。
createReducer：一个简化创建 Redux reducer 函数的实用程序。它在内部使用 Immer 通过在减速器中编写“可变”代码来大大简化不可变的更新逻辑，并支持将特定的动作类型直接映射到 case reducer 函数，这些函数将在调度该动作时更新状态。
一个重要的声明：
在内部，
createSlice使用createAction和createReducer，[...]
您可以将其理解createSlice为使用createReducer或帮助将事物绑定的函数。
关于你问题的第二部分：
export const selectUser = (state) => state.user.user; // What is that ? and why is it state.user and then a third user Object ???
当您使用 Redux 查看应用程序时，选择器是一种非常常见的模式。
“选择器”只是一个接受 Redux 状态作为参数并返回从该状态派生的数据的函数。砰！结束。
你的选择器正在做的是访问你的状态并从那里获取一些东西，可能在 React 组件中使用：
import { useSelector } from 'react-redux';
const App => () => {
const user = useSelector(selectUser);
return <div>My name is {user.name}</div>
}