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

Object property values

In the preceding section, you learned how to check for primitive property types. React components can also accept objects with primitive values—and other objects. If your component is expecting an object as a property value, you can use the same approach as you did for primitive values. The difference is how you structure your Props type declaration:

// @flow 
import React from 'react'; 
 
type Props = { 
  person: { 
    name: string, 
    age: number 
  } 
}; 
 
const Person = ({ person }: Props) => ( 
  <section> 
    <h3>Person</h3> 
    <p><strong>Name: </strong>{person.name}</p> 
    <p><strong>Age: </strong>{person.age}</p> 
  </section> 
); 
 
export default Person; 

This component expects a person property which is an object. Further, it expects this object ...

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