component in React Native


What is the component in React Native?

Components are independent and reusable bits of code, and they serve the same purpose as JavaScript functions but work in isolation and return HTML.

Which are the two types of components used in React Native?

In React Native, two main types of components make up an application:

  • Function components
  • Class components

These are structured the same as in a regular React app for the web.

Class Component

A class component must include the extended React. Component statement. This statement creates an inheritance to React.Component, and gives your component access to React.Component's functions.

The component also requires a render() method, and this method returns HTML.

Function Component

A Function component also returns HTML and behaves much the same way as a Class component, but Function components can be written using much less code, are easier to understand

Props

Components can be passed as a prop, which stands for properties. Props are like function arguments, and you send them into the component as attributes.

Components in Components: We can refer to components inside other components.

Components in Files: React is all about re-using code, and it is recommended to split your components into separate files.

Stateful Components - These components will have changing states.

Stateless Components - Stateless Components do not have any local state, also known as Dumb Components. Without any local state, these components do not need lifecycle methods or much of the boilerplate with a stateful component.