I have created a radio component but when clicked it does'nt show checked here is the code
import React from 'react';
import classnames from 'classnames';
const RadioButton = (field) => {
const inputClasses = classnames('form-group has-feedback ',{
'has-error': field.meta.touched && field.meta.error,
});
return(
<div className={inputClasses}>
<label className="radio-inline custom-radio nowrap">
<input
disabled={field.disabled}
type="radio"
name={field.input.name}
value={field.input.value}
defaultChecked={field.defaultChecked}
{...field.input}
/>
<span>{field.label}</span>
</label>
</div>
);
};
export default RadioButton;
here is the field:
<Field
label="True"
component={RadioButton}
name="True"
type="radio"
value={true}
defaultChecked={ true }
/>
<Field
label="False"
component={RadioButton}
name="False"
type="radio"
value={false}
defaultChecked={ false }
/>
this is the warning i am getting on console: Warning: RadioButton contains an input of type radio with both checked and defaultChecked props. Input elements must be either controlled or uncontrolled (specify either the checked prop, or the defaultChecked prop, but not both). Decide between using a controlled or uncontrolled input element and remove one of these props
can anyone help me out with this?