根据道具显示 JSX/HTML

Displaying JSX/HTML based on props

这种表达方式叫什么，应该如何使用或何时使用？

{props.type === "big" && <h2>{props.title}</h2>}

{} 部分是一个 JSX 表达式，它允许您在 JSX 标记中嵌入 JavaScript 代码。

&& 是一个逻辑与运算符，但在 JavaScript 中，&& 不会产生 true 或 false，而是这样做：

  1. 计算其左侧操作数
  2. 如果第 1 步的值是 falsy，&& 操作会将该结果作为结果并在此处停止
  3. 如果第 1 步的值是 truthy （falsy 的反义词），&& 操作计算右边的操作数并取它结果值

所以props.type === "big" && <h2>{props.title}</h2>表示：

  • 如果 props.type 是 "big"，请将 <h2>{props.title}</h2> 放在这里。
  • 如果不是，请不要在此处放置任何内容（因为 React 不会呈现 false、null 或 undefined）

how or when should it be used

它通常在需要有条件地渲染某些东西时使用。条件是第一部分（props.type === "big"）。正在渲染或未渲染的东西是第二部分(<h2>{props.title}</h2>)。