是否有一种方法只在满足特定条件时才向React组件添加属性?
我应该添加必需的和readOnly属性，以形成基于Ajax调用后呈现的元素，但我不知道如何解决这个问题，因为readOnly="false"并不等同于完全省略属性。
下面的例子应该解释我想要什么，但它不起作用。
(解析错误:意外的标识符)
function MyInput({isRequired}) {
return <input classname="foo" {isRequired ? "required" : ""} />
}
当前回答
在React中，我们将值作为Props从父组件传递给子组件。如果值为false，则不会将其作为道具传递。在某些情况下，我们也可以使用三元(条件运算符)。
其他回答
当您不需要该属性时，必须将其值设置为未定义 例子:
<a data-tooltip={sidebarCollapsed?'Show details':undefined}></a>
以一种简单的方式
const InputText= ({required = false , disabled = false, ...props}) =>
(<input type="text" disabled={disabled} required={required} {...props} />);
像这样使用它
<InputText required disabled/>
假设我们想要在条件为真时添加一个自定义属性(使用aria-*或data-*):
{...this.props.isTrue && {'aria-name' : 'something here'}}
假设我们想在条件为真时添加一个style属性:
{...this.props.isTrue && {style : {color: 'red'}}}
对于React[1]列出的一些布尔属性:
<input disabled={disabled} />
// renders either `<input>` or `<input disabled>`
其他属性:
<div aria-selected= {selected ? "" : undefined} />
// renders either `<div aria-selected></div>` or `<div></div>`
[1]布尔属性列表:https://github.com/facebook/react/blob/3f9480f0f5ceb5a32a3751066f0b8e9eae5f1b10/packages/react-dom/src/shared/DOMProperty.js#L318-L345
胡德马科的答案通常是正确的，但这里有另一种选择。
创建一个你喜欢的对象:
var inputProps = {
value: 'foo',
onChange: this.handleChange
};
if (condition) {
inputProps.disabled = true;
}
渲染与蔓延，可选的传递其他道具也。
<input
value="this is overridden by inputProps"
{...inputProps}
onChange={overridesInputProps}
/>
