patterntypescriptreactCritical
Typescript input onchange event.target.value
Viewed 0 times
typescriptinputeventtargetonchangevalue
Problem
In my react and typescript app, I use:
How do I correctly define the typings for the class, so I wouldn't have to hack my way around the type system with
If I put
onChange={(e) => data.motto = (e.target as any).value}How do I correctly define the typings for the class, so I wouldn't have to hack my way around the type system with
any?export interface InputProps extends React.HTMLProps {
...
}
export class Input extends React.Component {
}If I put
target: { value: string }; I get :ERROR in [default] /react-onsenui.d.ts:87:18
Interface 'InputProps' incorrectly extends interface 'HTMLProps'.
Types of property 'target' are incompatible.
Type '{ value: string; }' is not assignable to type 'string'.Solution
Generally event handlers should use
You can read why it so here (Revert "Make SyntheticEvent.target generic, not SyntheticEvent.currentTarget.").
e.currentTarget.value:You can read why it so here (Revert "Make SyntheticEvent.target generic, not SyntheticEvent.currentTarget.").
const onChange = (e: React.ChangeEvent) => {
const newValue = e. currentTarget.value;
}
Context
Stack Overflow Q#40676343, score: 1008
Revisions (0)
No revisions yet.