我正在開發一個聊天應用程式專案
但我收到了從后端(節點)獲取朋友的錯誤
我正在控制臺上獲取好友資料,但無法顯示。
這是我的背景關系和狀態
export const Messenger = () => {
// Context State
const { friends, setFriends, authInfo } = useAuth();
const [loggedUser, setLoggedUser] = useState();
const { updateNotification } = useNotification();
const fetchMessengerUsers = async () => {
try {
const token = getToken();
const config = {
headers: {
authorization: "Bearer " token,
},
};
const { data } = await client("/get-friends", config);
console.log(data);
setFriends(data);
} catch (error) {
updateNotification("error", "Failed To load the Chat");
}
};
useEffect(() => {
setLoggedUser(localStorage.getItem("auth-token"));
fetchMessengerUsers();
}, []);
然后作為回報,我將映射所有朋友以顯示它們
<div className="friends">
{friends && friends.length > 0
? friends.map((fd) => (
<div className="hover-friend">
<Friends friend={fd} />
</div>
))
: "No Friend"}
</div>
它在瀏覽器上顯示沒有朋友
此鏈接顯示它在瀏覽器上的顯示方式
uj5u.com熱心網友回復:
只需更改您的 fetchMessengerUsers 功能。
你需要設定 setFriends(data.friends)
const fetchMessengerUsers = async () => {
try {
const token = getToken();
const config = {
headers: {
authorization: "Bearer " token,
},
};
const { data } = await client("/get-friends", config);
console.log(data);
setFriends(data.friends); // you have to set friends array here, earlier you were setting the entire object.
} catch (error) {
updateNotification("error", "Failed To load the Chat");
}
};
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/527622.html
