vendredi 1 mars 2019

How to disable a checkbox inside a react component?

I would like to know if there is a way to disable a checkbox that is inside a component (react-switch). React-switch has an "disabled" prop, but i just want to disable the checkbox, not the entire thing.

React Code:

<Switch 
    onColor="#ff4a55"          
    checked={this.props.checked}
    onChange={this.props.onChange}
    boxShadow="0px 1px 5px rgba(0, 0, 0, 0.6)"
    activeBoxShadow="0px 0px 1px 10px rgba(0, 0, 0, 0.2)"
/>

Compiled code:

<div style="...">
    <div class="react-switch-bg" style="...">...</div>
    <div class="react-switch-handle" style="..."></div>
    <input type="checkbox" role="switch" style="...">
</div>

Compiled code i want:

<div style="...">
    <div class="react-switch-bg" style="...">...</div>
    <div class="react-switch-handle" style="..."></div>
    <input disabled type="checkbox" role="switch" style="...">
</div>

Many thanks!




Aucun commentaire:

Enregistrer un commentaire