I am trying to show an icon when i double click an element. Here is my project
https://codesandbox.io/s/brave-herschel-s092nm?file=/src/App.js
I know there is one option to create another component, but I think that is not necessary, because it is just a single icon i want to change, is there another simpler way to change the state ?
updated sandbox link
Something like this:
import Icon from "/your/Icon/component";
export default function MyApp() {
const [isIconVisible, setIsIconVisible] = React.useState(false);
function handleClick(e) {
if (e.detail === 2) {
setIsIconVisible(oldState => !oldState);
}
}
return (
<div>
<button onClick={handleClick}>Show/hide icon</button>
{isIconVisible && <Icon />}
</div>
);
}