I'm having an issue getting the Checkbox component to work properly with react hooks. I'm not finding many examples online on how to do so. My understanding is the the Checkbox Component should work identically to the HTML input[type=checkbox] element, but doesn't seem to be the case.
In the code below the first Kendo Checkbox will allow you to check it, but not uncheck it, while the 2nd HTML input[type=checkbox] element works as expected.
import React from 'react';import ReactDOM from 'react-dom';import React, {useState, useEffect} from "react";import { Checkbox} from "@progress/kendo-react-inputs"; function App(props) { const [checked, setChecked] = useState(false); return ( <div> <Checkbox label="Checkbox" checked={checked} onChange={e => setChecked(!checked) } /> <input type="checkbox" checked={checked} onChange={e => setChecked(!checked) } /> </div> );}ReactDOM.render( <App />, document.querySelector('my-app'));
I'm sure I'm missing something very simple, but can't identify it.
Rank 1
1 Answer, 1 is accepted
Hello, Bill,
I`m glad to inform you that this is already fixed in the dev version of the component.
https://www.telerik.com/kendo-react-ui/components/installation/development-builds/
After updating the demo to use the dev version, it was working as expected:
https://stackblitz.com/edit/react-t749mp-zybsgi?file=app/main.jsx
Apologies for the inconvenience this may have caused you.
Regards,
Stefan
Progress Telerik