Reader small image

You're reading from  React 16 Tooling

Product typeBook
Published inApr 2018
Reading LevelBeginner
PublisherPackt
ISBN-139781788835015
Edition1st Edition
Languages
Tools
Right arrow
Authors (2):
Adam Boduch
Adam Boduch
author image
Adam Boduch

Adam Boduch has been involved in large-scale JavaScript development for nearly 15 years. Before moving to the frontend, he worked on several large-scale cloud computing products using Python and Linux. No stranger to complexity, Adam has practical experience with real-world software systems and the scaling challenges they pose.
Read more about Adam Boduch

Christopher Pitt
Christopher Pitt
author image
Christopher Pitt

Christopher Pitt is a principal developer for SilverStripe in Wellington, New Zealand. He usually works on open source software, though sometimes you'll find him building compilers and robots.
Read more about Christopher Pitt

View More author details
Right arrow

Validating event handler functions


React components use functions to respond to events. These are called event handler functions, and they're passed an event object as an argument when the React event system calls them. It can be useful to use Flow to explicitly type these event arguments to make sure that your event handler is getting the type of element that it expects.

For example, assume that you're working on a component that responds to clicks from an <a> element. Your event handler function also needs to interact with the clicked element, in order to get the href property. Using the Flow types exposed by React, you can ensure that the correct element type is indeed triggering the event that is causing your function to run:

// @flow
import * as React from 'react';
import { Component } from 'react';

class EventHandler extends Component<{}> {
  clickHandler = (e: SyntheticEvent<HTMLAnchorElement>): void => {
    e.preventDefault();
    console.log('clicked', e.currentTarget...
lock icon
The rest of the page is locked
Previous PageNext Page
You have been reading a chapter from
React 16 Tooling
Published in: Apr 2018Publisher: PacktISBN-13: 9781788835015

Authors (2)

author image
Adam Boduch

Adam Boduch has been involved in large-scale JavaScript development for nearly 15 years. Before moving to the frontend, he worked on several large-scale cloud computing products using Python and Linux. No stranger to complexity, Adam has practical experience with real-world software systems and the scaling challenges they pose.
Read more about Adam Boduch

author image
Christopher Pitt

Christopher Pitt is a principal developer for SilverStripe in Wellington, New Zealand. He usually works on open source software, though sometimes you'll find him building compilers and robots.
Read more about Christopher Pitt