React Hooks setState

“What is a Hook? A Hook is a special function that lets you “hook into” React features. For example, useState is a Hook that lets you add React state to function components.”

“When would I use a Hook? If you write a function component and realize you need to add some state to it, previously you had to convert it to a class. Now you can use a Hook inside the existing function component.”

1. import React, {useState} from 'react'
2. in a function component, declare a State Variable:

instead of using state={} we use useState.

We can initialize variable by passing an argument in useState(), in this case we initialize displayFront =true.

3. We can update the variable using setDisplayFront.

4. Read State

instead of using {this.state.displayFront}, we can just use {displayFront} to call the variable.

Sources:

Using the State Hook - React