作者:手机用户2502893613 | 来源:互联网 | 2023-09-18 20:00
truefalse&&expression在学习react的过程中,遇到了如下一个方法:该方法中,定义了一个未读消息unreadMessages数然后返回一个提醒你还有多少未读消息
true/false && expression
在学习react的过程中,遇到了如下一个方法:
function Mailbox(props) {
const unreadMessages = props.unreadMessages;
return (
Hello!
{unreadMessages.length > 0 &&
You have {unreadMessages.length} unread messages.
}
);
}
该方法中,定义了一个未读消息unreadMessages数
然后返回一个提醒你还有多少未读消息的一段代码
其中的核心代码:
unreadMessages.length > 0 &&
You have {unreadMessages.length} unread messages.
&&左边的表达式判断消息数是否大于0,右边表达式渲染还有多少条未读消息数;
之所以能这样做,是因为在 Javascript 中
true && expression 总是返回 expression
false && expression 总是返回 false。
如果条件是 true,&& 右侧的元素就会被渲染
如果是 false,React 会忽略并跳过它。