有没有办法只在满足特定条件时向 React 组件添加属性？
我应该在渲染后基于 Ajax 调用向表单元素添加 required 和 readOnly 属性，但我不知道如何解决这个问题，因为readOnly="false"这与完全省略该属性不同。
下面的例子应该解释了我想要什么，但它不起作用。
（解析错误：意外的标识符）
function MyInput({isRequired}) {
return <input classname="foo" {isRequired ? "required" : ""} />
}
显然，对于某些属性，如果传递给它的值不真实，React 足够智能以省略该属性。例如：
const InputComponent = function() {
const required = true;
const disabled = false;
return (
<input type="text" disabled={disabled} required={required} />
);
}
将导致：
<input type="text" required>
更新：如果有人对如何/为什么发生这种情况感到好奇，您可以在 ReactDOM 的源代码中找到详细信息，特别是在DOMProperty.js文件的第30和167行。
juandemarco 的回答通常是正确的，但这里有另一种选择。
以你喜欢的方式构建一个对象：
var inputProps = {
value: 'foo',
onChange: this.handleChange
};
if (condition)
inputProps.disabled = true;
渲染传播，也可以选择传递其他props。
<input
value="this is overridden by inputProps"
{...inputProps}
onChange={overridesInputProps}
/>
下面是使用的示例自举的Button经由阵营的自举（版本0.32.4）：
var condition = true;
return (
<Button {...(condition ? {bsStyle: 'success'} : {})} />
);
根据不同的条件，无论是{bsStyle: 'success'}或{}将被退回。然后，扩展运算符会将返回对象的属性扩展到Button组件。在虚假情况下，由于返回的对象上不存在任何属性，因此不会将任何内容传递给组件。
基于Andy Polhill 评论的另一种方式：
var condition = true;
return (
<Button bsStyle={condition ? 'success' : undefined} />
);
唯一的小区别是在第二个示例中，内部组件<Button/>的props对象将具有bsStyle一个值为 的键undefined。
这是一个替代方案。
var condition = true;
var props = {
value: 'foo',
...( condition && { disabled: true } )
};
var component = <div { ...props } />;
或者它的内联版本
var condition = true;
var component = (
<div
value="foo"
{ ...( condition && { disabled: true } ) } />
);
这是我的一种方法。
有条件的：
<Label
{...{
text: label,
type,
...(tooltip && { tooltip }),
isRequired: required
}}
/>
我仍然更喜欢使用常规的传递 props 的方式，因为在没有任何条件的情况下它更具可读性（在我看来）。
没有条件：
<Label text={label} type={type} tooltip={tooltip} isRequired={required} />