首先梳理逻辑:
如果错误信息为空,说明用户名密码正确,就不显示错误信息提示框(给提示框样式类添加一个hide)
如果错误信息不为空,说明用户名密码不正确,就显示错误信息提示框(给提示框样式类添加一个空字符)
在css世界里,还有计算机语言的很多地方,不/没有 等于 加空
换言之,什么都不添加等于加空, 不加也是加 ,加空而已.
代码实现:
<div id="messageBox" class="alert ${empty message ? 'hide' : ''}">
</div>
代码解释:
如果message为空,就给该提示框样式类添加一个hide类样式;
如果message不为空,就给该提示框的样式类加空
三元表达式是一个条件处理器,根据一个条件的正反生成两个值中的一个
然后将这个生成的值添加给样式类
在这里 message如果为空 生成hide 然后添加;如果不为空 生成'' 然后添加(等不不添加)