I have a very simple React input which triggers an action if key pressed is 'Enter' - it'll perform a network request later, but for now just triggers a log of state.
Here's the input:
<input onKeyDown={handleEnterPress} />
And here's the onKeyDown event, which is triggering successfully:
const handleEnterPress = (e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.code === "Enter") {
console.log(state);
}
}
However, at the moment, the input remains 'focused' when enter is pressed - when in reality, what I want to happen is the input to be unfocused, meaning the action is effectively 'complete' and no more editing is required.
I've been trying to search for a way to do this - but can't find anything. What would be the most effective and efficient way of me unfocusing the input upon 'enter' being pressed?