React + Typescript onChange Event Types
We’ve written about typescript quite a
few times
and we’re big fans. When working with typescript and forms it is useful to know
the onChange event types. We’ve collected them here in one place for reference
and convenience
<select
name="mySelect"
onChange={(e: React.ChangeEvent<HTMLSelectElement>) => setSelect(e)}
></select>
<input
name="myIput"
type="text"
onChange={(e: React.FormEvent<HTMLInputElement>) => setIput(e)}
/>
<input
name="myCheckbox"
type="checkbox"
onChange={(e: React.ChangeEvent<HTMLInputElement>) => setCheckbox(e)}
/>
<input
name="myRadio"
type="radio"
onChange={(e: React.ChangeEvent<HTMLInputElement>) => setRadio(e)}
/>
<textarea
name="myTextarea"
onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) => setTextarea(e)}
/>Read more about it here. This Medium article is a good reference as well.