Setting state in functional components -React

Setting state in functional components -React

·

1 min read

When using functional components in React the only way to use state and set state is by using Hooks. The most common hook being useState. With useState you pass the initial state to this function and it returns a variable with the current state value and another function to update this value in that order.

const data=[ 
{
    id: 1,
    name: 'Bertie',
    age: 19
  },
{
    id: 2,
    name: ' Yates',
    age: 29
  },

]

 const [people, setPeople] = useState(data);

return(
 {people.map((person) => {
  const { id, name, age } = person;
  <article key={id} >

            <div>
              <h4>{name}</h4>
              <p>{age} years</p>
            </div>
          </article>
       <button onClick={() => setPeople([])}>clear all</button>

)}
})