我如何使这项工作？
<input type="checkbox" id={"delivery-" + this.props.ID} {this.props.disableIt ? 'disabled' : ''} />
我期待这个代码 - {this.props.disableIt ? 'disabled' : ''} - 输出一个 'disabled' 属性，但它会抛出 'Unexpected token (102:89)'。但是如果我直接在那里放一个静态的“禁用”词，它就可以工作。
使用 this.props 时禁用复选框不起作用
IT技术
javascript
reactjs
react-jsx
2021-05-10 13:37:43
1个回答
使用 react 时，disabled它是一个需要设置的 proptrue或false. 当你只定义没有值的props，并且这个props是布尔值时，默认情况下将值设置为true. 这就是当您手动定义props时它起作用的原因。
<input type="checkbox" disabled={false} />
<input type="checkbox" disabled={true} />
<input type="checkbox" disabled />
<input type="checkbox" id={"delivery-" + this.props.ID} disabled={this.props.disableIt} />
例如：
var Example = React.createClass({
getInitialState: function() {
return {
disabled: false
};
},
toggle: function() {
this.setState({
disabled: !this.state.disabled
});
},
render: function() {
return (
<div>
<p>Click the button to enable/disable the checkbox!</p>
<p><input type="button" value="Enable/Disable" onClick={this.toggle} /></p>
<label>
<input type="checkbox" disabled={this.state.disabled} />
I like bananas!
</label>
</div>
);
}
});
ReactDOM.render(
<Example />,
document.getElementById('container')
);
这是工作示例：https : //jsfiddle.net/crysfel/69z2wepo/59502/
祝你好运！