javascript - 尽管调试器另有说明，为什么该变量不被视为 0？

Question

我正在编写一个 React 组件，它将评论总数作为支柱。当评论数为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。变量好、中性和坏也都= 0。

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

Answer 1

if (totalReviews === 0)

你只在 jsx 中将 js 语句用大括号括起来，但你的 if 语句只是普通的 js。