reactjs - TypeError：无法读取未定义的属性（读取“用户名”）

Question

整个代码段：

const Message= forwardRef(({ message,username}, ref)=> {
    const isUser = username === message.username;
    return (
            <div ref={ref} className={`message ${isUser && 'message__user'}`}>
                <Card className={isUser ? "message__userCard" : "message__guestCard"}>
                <CardContent >
                    <Typography 
                    color="black"
                    variant="h5"
                    component="h2"
                    >
                        {message.username}:{message.message}
                    </Typography>
                </CardContent>
                </Card>
            </div>
            
    )
});

export default Message;

错误表明此部分中未定义用户名部分。无法读取未定义的属性（读取“用户名”）

const isUser = username === message.username;

调用 Message 的父级是

<FlipMove>
     {
       messages.map(({id , message}) => (
         <Message key={id} username={username} message={message}/> //Message.js component,passing the text to message component
       ))
     }
     </FlipMove>