In my reactjs project, when I onchange the toggleswitch, I am getting the error as
Warning: Failed prop type: The prop `checked` is marked as required in `ToggleSwitch`, but its value is `undefined`.
I have an array which contains some values in which I need to map and to show the toggleswitch. my code is:
let [ischecked, setChecked] = useState({
checkedA: true,
});
const handleSwitchChange = (event, func) => {
setChecked(event);
};
Object.keys(arr).map((key, val) => (
<ToggleSwitch
className='onFunc'
defaultChecked={ischecked.checkedA}
onChange={(e)=>handleSwitchChange(e,key)}
name={`fun[${key}]`}
id={`on_${key}`}
optionLabels={["On", "Off"]}
value={ischecked.checkedA === true ? 'y' : 'n'}
/>
))
</td>
Pleas help. I don't know how to fix the issue.
I need to remove the console eror when i click on the toggleswitch.
This is happening because in your ToggleSwitch component you have this :
ToggleSwitch.propTypes = {
//...
checked: PropTypes.boolean.isRequired
};
This means that your ToggleSwitch should recieve a property named checked.
so you have to pass it to the component :
<ToggleSwitch
//...
checked={value}
/>
if you don't really need it to be required you can remove isRequired :
ToggleSwitch.propTypes = {
//...
checked: PropTypes.boolean
};
so it will be optional
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments