尽管调试器另有说明，为什么这个变量不被认为是 0？

Question

我正在编写一个 React 组件，它将评论总数作为 prop。当评论数为0时，我想渲染一个元素说明

<div>No reviews yet.</div>

否则，我将呈现包含评论数据的元素。这是组件及其上下文：

const Stats = ({good, neutral, bad, totalReviews}) => {
    if ({totalReviews} === 0) 
        return <div>No reviews yet.</div>
    else {
        return (
            <div>
                <Stat text="Total: " amount={totalReviews} />
            </div>
        );
    }
}

const App = () => {
  const [good, setGood] = useState(0);
  const [neutral, setNeutral] = useState(0);
  const [bad, setBad] = useState(0);

  let totalReviews = good + neutral + bad;

  return (
    <div>  
        <Stats totalReviews={totalReviews} />
    </div>
  )
}

我已经使用 debugger 命令在 Chrome 的开发人员控制台中检查每个变量的值。它表明totalReviews = 0。变量 good, neutral, and bad 也都 = 0.

我也用过console.log(totalReviews)。 console.log显示0。为什么我的程序进入第二个条件就好像 totalReviews 不为 0？

Answer 1

if (totalReviews === 0)

你只在jsx里面把js语句用大括号括起来，而你的if语句就是普通的js。

Answer 2

你的 if 条件有问题。它应该是 if (totalReviews === 0) 或 if (totalReviews == 0) 以避免强类型对话检查。您在 if 条件中添加了 {} ，这不是标准方式

尽管调试器另有说明，为什么这个变量不被认为是 0？

Why is this variable not considered to be 0 despite debugger saying otherwise?

javascript

jsx

equals-operator

reactjs