您好,我试图使开关按钮(复选框)处于默认选中状态,并且在反应中也被禁用。但是以某种方式,如果我仅将checked = {true}放进去,它将被检查,但是当我添加disabled =“ disabled”时,开关按钮将被取消选中和禁用(即使有选中属性)。有人可以建议吗?谢谢
<label htmlFor="disabled-on" className="switch__label">
<input
type="checkbox"
name="disabled-on"
id="disabled-on"
checked={true}
disabled="disabled" /* if added disabled it's not working with checked" */
className="switch__input switch__input--disabled-on"
/>
[您的其他地方的代码可能有问题,请检查此代码-看起来一切正常。
class TodoApp extends React.Component {
constructor(props) {
super(props)
}
render() {
return (
<div>
<ul>
<li>
<label htmlFor="disabled-on" className="switch__label">
custom checkbox 1
<input
type="checkbox"
name="disabled-on"
id="disabled-on"
checked={true}
disabled="disabled"
className="switch__input switch__input--disabled-on"
/>
</label>
</li><li>
<label htmlFor="disabled-on" className="switch__label">
custom checkbox 2
<input
type="checkbox"
name="disabled-off"
id="disabled-off"
checked={true}
className="switch__input switch__input--disabled-on"
/>
</label>
</li>
</ul>
</div>
)
}
}
ReactDOM.render(<TodoApp />, document.querySelector("#app"))
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="app"></div>