Destructuring Props

Destructuring is used a lot in components.

function ArticleTitle(props) {
  return <Text>{props.title} for React Native</Text>;
}

function ArticleTitle({title}) {
  return <Text>{title} for React Native</Text>;
}

// Usage
<ArticleTitle title="Bootcamp" /> 
// expected output: Bootcamp for React Native

// Usage
<ArticleTitle title="Advanced Bootcamp" /> 
// expected output: Advanced Bootcamp for React Native

There's a syntax for collecting remaining props into an object.

function ArticleTitle({title, ...rest}) {
  return <Text>{title} for React Native</Text>;
}