Hands-On Full Stack Development with Spring Boot 2 and React - Second Edition

Stateless components

The React stateless component (a functional component) is just a pure JavaScript function that takes props as an argument and returns a react element. The following example shows how a stateless component is used by using the arrow function:

import React from 'react';const HeaderText = (props) => { return (   <h1>     {props.text}   </h1> )}export default HeaderText;

Now, when you use functions to define a React component, you don't have to use the this keyword. A stateless component defined using a function doesn't have life cycle methods. For example, in the previous HeaderText example, you can see that there is no render() method.

Our HeaderText example component is called a pure component. A component is said to be pure if ...