Issue
I am new to React and TypeScript.
I want to toggle a boolean state (true/false) with a handler function. I've read other posts about how to do this in ES6 but I am unclear of how to achieve this in TypeScript.
So far I have:
const MyComponent = () => {
const [collapseUpper, setCollapseUpper] = React.useState(true);
const handleCollapse = () => {
collapseUpper = !setCollapseUpper;
};
return (
<Link onClick={handleCollapse}>More</Link>
<Collapse in={collapseUpper}>
//content
But I cannot get it to work.
Can anyone point me in the right direction?
Solution
This is how it should be done:
const handleCollapse = () => {
setCollapseUpper(!collapseUpper);
};
You will need to call the setCollapseUpper
to handle any updates in state.
Better still, you can use the callback function to update the state:
const handleCollapse = () => {
setCollapseUpper((prevState) => !prevState);
};
Answered By - wentjun
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.