I am trying to use a React function component to have a number increment + 1 on keydown but instead of increasing by one (i.e. 1,2,3,4,5) it returns it doubles the number and then increases by on (i.e. 1,3,7,15,31). How Do I get this to react correctly?
const Display = (props) => {
return(
<div id="display">{props.text}</div>
)
}
const App = () => {
[displayText, setDisplayText] = React.useState(0);
window.addEventListener('keydown',(e)=>{
setDisplayText(displayText + 1)
})
return (
<div class="container">
<Display text={displayText} />
</div>
)
}