add items to a react array in hooks code example

Example 1: React Hooks append state

setTheArray(currentArray => [...currentArray, newElement])

Example 2: How to add object in an array using useState

import React, { useState } from 'react';
 
function App() {
 
  const [items, setItems] = useState([]);
 
  // handle click event of the button to add item
  const addMoreItem = () => {
    setItems(prevItems => [...prevItems, {
      id: prevItems.length,
      value: getRandomNumber()
    }]);
  }
 
  // generate 6 digit random number
  const getRandomNumber = () => {
    return Math.random().toString().substring(2, 8);
  }
 
  return (
    

      
useState with an array in React Hooks - Clue Mediator
      

      Add More
      


      Output:
      
{JSON.stringify(items, null, 2)}
    
  );
}
 
export default App;

Example 3: add items to a react array in hooks

const addMessage = (newMessage) => setMessages(state => [...state, newMessage])

Example 4: add object to array react hook

setTheArray([...theArray, newElement]);

Example 5: add items to a react array in hooks

const addMessage = (newMessage) => setMessages(state => [newMessage, ...state])