useReducer没有更新正确的分派值

Question

是react的初学者，我已经尝试了所有我能做的。"联系人"总是未定义的。请注意，我删除了一些不相关的代码，只粘贴了相关的代码。

Thanks in advance

const initialState = {
contacts: ["[e-mail]"],
loggedInUser: null,
isChatPage: true
}
const [state, dispatch] = useReducer(chatReducer, initialState);  
useEffect(() => {
console.log(state.contacts);
}, [state]);
const setContacts = (contactList) => {
console.log(contactList);

dispatch({
type: SET_CONTACT_LIST,
payoad: contactList
})
}

userReducer函数是

const chatReducer = (state, action) => {
console.log(action);
console.log(state);
switch(action.type) {
case TOGGLE_CHAT:
return {
...state,
isChatPage: action.payload
}
case SET_LOGGED_USER:
return {
...state,
loggedInUser: action.payload
}
case SET_CONTACT_LIST:
return {
...state,
contacts: action.payload
}
}
}

setContact从另一个文件调用，如下所示:

const context = useContext(ChatContext);
const updateRealTimeUsers = () => {
db.collection("users")
.get()
.then((querySnapshot) => {
var users = [];
querySnapshot.forEach((doc) => {
users.push(doc.data().email);
});
console.log("Current users: ", users);
context.setContacts(users);

});

}
useEffect(() => {
updateRealTimeUsers();
// console.log(contacts);

}, []);

chatReducer的日志如下:

{type: "SET_CONTACT_LIST", payoad: Array(3)}
payoad: (3) ["[e-mail]", "[e-mail]", "[e-mail]"]
type: "SET_CONTACT_LIST"
[[Prototype]]: Object
chat-reducer.js:5 
{messages: Array(13), chats: Array(12), users: Array(7), contacts: null, contactsDummy: Array(1), …}
chats: (12) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
contacts: null
isChatPage: true
loggedInUser: {email: "[e-mail]", uid: "0aic691KY4ZmJDXv3T6mji9qZnO2"}
messages: (13) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
test: (3) [1, 2, 3]
user: {}
users: (7) [{…}, {…}, {…}, {…}, {…}, {…}, {…}]

Answer 1

我想你在setContacts中有一个输入错误。把payload写成payoad!

const setContacts = (contactList) => {
console.log(contactList);

dispatch({
type: SET_CONTACT_LIST,
payoad: contactList
})
}