博客列表 >使用&&判断的场景差异

使用&&判断的场景差异

P粉962186587
P粉962186587原创
2022年03月17日 20:11:27389浏览

最近在开发中发现一个小差异,在我使用&&来判断一个元素是否存在的场景下,打开html结构能看到元素里多了一对空的标签 <div></div>,这个时候一旦涉及弹性盒模型背景下的布局分配,它就会占一个空间,视觉上看起来它是没有元素的。

实际上,它会因为类似场景下的布局分配多一部分的占位,所以我认为在项目中要进行场景的区分来使用&&,比如是一个右下角渐渐弹出的提示,这种不在文档流上存在占位的元素,就可以使用&&来进行判断,但涉及占位的场景,为了稳妥起见,其他时候还是建议使用下方的三元运算符来进行判断。

  1. //1、判断是否存在某元素,是则运行接下来的代码
  2. res && this.setState({ qrCode: res });
  3. //2、一般用于if判断和其他判断条件并用
  4. typeof url === 'string' && url.length
  1. //3、判断一个元素是否存在
  2. {isCheck && (
  3. <Button size="small" >
  4. 按钮
  5. </Button>
  6. ) }
  7. //判断一个元素是否存在的另一种方式(推荐)
  8. {isCheck ? (
  9. <Button size="small" >
  10. 按钮
  11. </Button>
  12. ) : null}
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议