Reactief toevoegen aan array in React

Laten we werken met het reactief toevoegen van elementen aan een array. Laten we voor het voorbeeld aannemen dat we een array hebben die wordt weergegeven als een lijst ul:

jsxfunction App() {
  const [notes, setNotes] = useState([1, 2, 3, 4, 5]);
  
  const result = notes.map((note, index) => {
    return <li key={index}>{note}</li>;
  });
  
  return <div>
    <ul>
      {result}
    </ul>
  </div>;
}

Задание 1

Maak een knop waarop, wanneer erop wordt geklikt, een nieuw element wordt toegevoegd aan het einde van de array, waardoor een nieuwe li wordt toegevoegd aan het einde van de ul-tag.

Задание 2

Maak een invoerveld en een knop. Wanneer er op de knop wordt geklikt, laat dan de tekst van het invoerveld een nieuwe li-tag worden aan het einde van de ul-tag.