我正在呼叫這樣的組件
<div className="sidebar__chats">
<SidebarChat addNewChat />
我期待所有頭像,除了第一個應該說“添加新聊天”的頭像。這是組件的代碼
function SidebarChat(addNewChat) {
const [seed, setSeed] = useState("");
useEffect(() => {
setSeed(Math.floor(Math.random() * 5000));
}, []);
const createChat = () => {
const roomName = prompt("please enter the name for chat");
if (roomName) {
//do some clever database stuff
}
};
return (
<>
{!addNewChat ? (
<div className="sidebarChat">
<Avatar
alt="Jo?o Espinheira"
src={`https://avatars.dicebear.com/api/pixel-art/${seed}.svg`}
sx={{ width: 38, height: 38 }}
/>
<div className="sidebarChat__info">
<h2>room name</h2>
<p>last message...</p>
</div>
</div>
) : (
<div onClick={createChat} className="sidebarChat">
<h2>add new chat</h2>
</div>
)}
</>
);
}
export default SidebarChat;
誰能幫忙,我認為這應該可行,但不能進入其他條件。有誰知道為什么?當我不在 addnewchat 中使用“!”時,每個人都會變成頭像,并且不執行 else 陳述句。我不明白為什么我不能這樣使用,因為代碼沒問題
目前我有這個結果 image1,它應該是這樣的image2
uj5u.com熱心網友回復:
將組件的第一行更改為
function SidebarChat({addNewChat}) {
組件的引數是一個包含所有道具的物件,因此您需要對其進行解構以訪問給定的道具。
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/529663.html
下一篇:計算嵌套陣列中的專案數
