如何有条件地将一组道具添加到反应组件？

Question

我有一组道具，只有在满足特定条件时才需要将其应用于组件。
所以我将道具分组在 object 中：

const props = {
  a: "",
  b: "",
};

然后尝试有条件地将它们应用于组件：

<div {condition && ...props}/>

但是 React 似乎不允许这样做，那么还有其他方法吗？

Answer 1

您应该包装您的表达式，然后对该表达式的结果使用扩展语法：

<div {...(condition && props)}></div>

当条件为false时， &&运算符的计算结果为 false。 结果，传播语法最终会传播false ，这在 object 属性中传播是无操作的。 当condition为true时， &&评估为props ，允许您传播 object 属性。