为什么这个redux工具箱用户变量总是未定义的

Question

我正试图将一个用户添加到redux工具包切片中的state.users中。这里是userManagementSlice.js:

import { createSlice } from '@reduxjs/toolkit'
const initialState = {
users: [],
}
export const userManagementSlice = createSlice({
name: 'userManagement',
initialState,
reducers: {
addUser: (state, action) => {
const user = action.payload;
state.users.push(user);
},
},
})
// Action creators are generated for each case reducer function
export const { addUser } = userManagementSlice.actions
export default userManagementSlice.reducer

以下是一个组件的关键代码，该组件监听全局状态下的用户，并尝试通过调度将用户添加到该数组：

const [firstName, setFirstName] = useState();
const [lastName, setLastName] = useState();
const users = useSelector((state) => state.users)
const dispatch = useDispatch()
const addUser2 = () => {
const user = {
firstName,
lastName
}
dispatch(addUser(user));
}

但是，从组件记录到控制台的USERS UPDATED值始终未定义：

useEffect(() => {
console.log('USERS UPDATED: ' + users);
// reset inputs
setFirstName('');
setLastName('');
}, [users]);

以下是配置存储设置：

import { configureStore } from '@reduxjs/toolkit'
import userManagementReducer from '../features/userManagement/userManagementSlice'
export const store = configureStore({
reducer: {
userManagement: userManagementReducer,
},
})

知道我在这里做错了什么吗？

Answer 1

您在userManagement安装切片，因此您的选择器必须是

const users = useSelector((state) => state.userManagement.users)