Issue
In a React app with Typescript i get a Typescript error during compile time and in the editor:
TS2339: Property isComposing does not exist on type Event
This happens on an OnChange event in a HTML Input, which is defined like this:
import { InputHTMLAttributes } from 'react';
export interface TypingState {
inputProps: InputHTMLAttributes<HTMLInputElement>;
}
inputProps: {
onChange: (e) => handleInput(e.target.value, e.nativeEvent.isComposing)
}
Why is the property isComposing
not existing on the nativeEvent?
In the Browser console the property is present and the code is working.
In the types definition the generic type HTMLInputElement
is passed to the onChange handler.
onChange?: ChangeEventHandler<T> | undefined;
Is HTMLInputElement maybe the wrong type here?
Solution
I logged the value of e.nativeEvent
inside the Codesandbox and it logged an instance of InputEvent
constructor. so, you can type-gaurd using the constructor like this:
if(e.nativeEvent instanceof InputEvent) {
e.nativeEvent.isComposing; // works as expected
}
Answered By - Arash jahan bakhshan
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.