I'm having a checkbox group and I want each item in my checkbox has a button which looks like in my image.
Here is my code and I don't know how to make the button appear. Need some help!! Thank you!
const CheckboxGroup = Checkbox.Group;
const plainOptions = ['Agence 1', 'Agence 2', 'Agence 3'];
const defaultCheckedList = ['Agence 1', 'Agence 2', 'Agence 3'];
const App: React.FC = () => {
const [checkedList, setCheckedList] = useState<CheckboxValueType[]>(defaultCheckedList);
const [checkAll, setCheckAll] = useState(false);
const onChange = (list: CheckboxValueType[]) => {
setCheckedList(list);
setCheckAll(list.length === plainOptions.length);
};
const onCheckAllChange = (e: CheckboxChangeEvent) => {
setCheckedList(e.target.checked ? plainOptions : []);
setCheckAll(e.target.checked);
};
return (
<>
<Checkbox onChange={onCheckAllChange} checked={checkAll}>
Check all
</Checkbox>
<CheckboxGroup options={plainOptions} value={checkedList} onChange={onChange} />
</>
);
Aucun commentaire:
Enregistrer un commentaire