O'Reilly logo

React 16 Tooling by Adam Boduch

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Validating component state

You can validate the properties of functional React components by typing the props argument that's passed to the component. Some of your components will have state and you can validate a component's state much the same as with properties. You can create a type that represents the state of your component, and pass this to Component as a type argument.

Let's take a look at a container component that has state that is used and manipulated by a child component:

// @flow 
import React, { Component } from 'react'; 
import Child from './Child'; 
 
type State = { 
  on: boolean 
}; 
 
class Container extends Component<{}, State> { 
  state = { 
    on: false 
  } 
 
  toggle = () => { 
    this.setState(state => ({ 
      on: !state.on 
    }));
 } render() { return ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required