I need to set the defaultChecked on page load which can later be changed by the user
<input
ref={(element) => (this['input' + item.key] = element)}
name={item.key}
placeholder='Config value'
defaultChecked={item.value === true}
value='true'
type='radio'
onChange={(event) => this.validateCValue(event.target.value, item)}
/>
<label> True</label>
Radio inputs can only be checked but not unchecked, if you set it to true, the user will not be able to uncheck it, maybe you meant to use a checkbox?
const [checked, setChecked] = useState(true);
const handleChange = () => {
setChecked(checked => !checked);
};
return (
<div className="App">
<input
placeholder="Config value"
defaultChecked={checked}
type="checkbox"
onChange={handleChange}
/>
<label>{checked ? "checked" : "not checked"}</label>
</div>
);