React组件条件渲染帖子评论数的三元表达式问题

你的问题出在三元表达式的分支返回值写反了，和判断条件本身无关。
首先明确JS语法规则：x == null 仅会在x为null或undefined时返回true，数值0、正整数都不会命中这个判断，不会误伤0值评论数的场景。
你当前代码的逻辑完全写反了：

• 当评论数字段无有效值（null/undefined）时，走你标记的待填充位置
• 当评论数字段有值（包括0、所有正整数的正常场景）时，固定渲染字符串'0'，自然会出现数值渲染异常的问题。

正确代码 #

直接把两个分支的返回值调换即可，逻辑为：字段无有效值时兜底显示0，有值时直接渲染字段本身，0和正整数都能正常展示：

{this.props.post.comments_count == null ? 0 : this.props.post.comments_count}

如果你只想修改你标记的i want to show count here位置、不动其他代码，那你需要先把判断条件从== null改成!= null，再在标记位置填入this.props.post.comments_count，最终代码如下：

{this.props.post.comments_count != null ? this.props.post.comments_count : '0' }

注意不要用!this.props.post.comments_count作为判断条件，这种写法会把数值0识别为假值，导致零评论场景命中兜底逻辑，出现零值无法正常渲染的问题。

内容的提问来源于stack exchange，提问作者TTOVARISCHH