File tree Expand file tree Collapse file tree 3 files changed +28
-8
lines changed
playground/src/components Expand file tree Collapse file tree 3 files changed +28
-8
lines changed Original file line number Diff line number Diff line change @@ -132,10 +132,20 @@ const element = <div style={styles} ...
132132[⇧ back to top](#table-of-contents)
133133
134134#### `React.ReactEventHandler<E>`
135- Type representing React event handler
135+ Type representing generic event handler
136136```tsx
137- const handleChange: React.ReactEventHandler<HTMLInputElement> = (ev) => { ...
138- const element = <input onChange = { handleChange } ...
137+ const handleChange: React.ReactEventHandler<HTMLInputElement> = (ev) => { ... }
138+
139+ <input onChange = { handleChange } ... />
140+ ` ` `
141+ [⇧ back to top](#table-of-contents)
142+
143+ #### ` React .MouseEvent <E >` | ` React .KeyboardEvent <E >` | ` React .TouchEvent <E >` etc...
144+ Type representing more specific event handler
145+ ` ` ` tsx
146+ const handleChange = (ev : React .MouseEvent <HTMLDivElement >) => { ... }
147+
148+ <div onMouseMove = { handleChange } ... />
139149` ` `
140150[⇧ back to top](#table-of-contents)
141151
@@ -400,7 +410,7 @@ interface MouseProviderState {
400410export class MouseProvider extends React .Component <MouseProviderProps , MouseProviderState > {
401411 state = { x: 0 , y: 0 };
402412
403- handleMouseMove = (event : React .MouseEvent <any >) => {
413+ handleMouseMove = (event : React .MouseEvent <HTMLDivElement >) => {
404414 this .setState ({
405415 x: event .clientX ,
406416 y: event .clientY ,
Original file line number Diff line number Diff line change @@ -47,10 +47,20 @@ const element = <div style={styles} ...
4747[⇧ back to top](#table-of-contents)
4848
4949#### `React.ReactEventHandler<E>`
50- Type representing React event handler
50+ Type representing generic event handler
5151```tsx
52- const handleChange: React.ReactEventHandler<HTMLInputElement> = (ev) => { ...
53- const element = <input onChange = { handleChange } ...
52+ const handleChange: React.ReactEventHandler<HTMLInputElement> = (ev) => { ... }
53+
54+ <input onChange = { handleChange } ... />
55+ ` ` `
56+ [⇧ back to top](#table-of-contents)
57+
58+ #### ` React .MouseEvent <E >` | ` React .KeyboardEvent <E >` | ` React .TouchEvent <E >` etc...
59+ Type representing more specific event handler
60+ ` ` ` tsx
61+ const handleChange = (ev : React .MouseEvent <HTMLDivElement >) => { ... }
62+
63+ <div onMouseMove = { handleChange } ... />
5464` ` `
5565[⇧ back to top](#table-of-contents)
5666
Original file line number Diff line number Diff line change @@ -12,7 +12,7 @@ interface MouseProviderState {
1212export class MouseProvider extends React . Component < MouseProviderProps , MouseProviderState > {
1313 state = { x : 0 , y : 0 } ;
1414
15- handleMouseMove = ( event : React . MouseEvent < any > ) => {
15+ handleMouseMove = ( event : React . MouseEvent < HTMLDivElement > ) => {
1616 this . setState ( {
1717 x : event . clientX ,
1818 y : event . clientY ,
You can’t perform that action at this time.
0 commit comments