React კომპონენტი დაწერეთ, სადაც არის 'დამატება' ღილაკი. როდესაც დააჭერთ 'დამატება' ღილაკს, ემატება ახალი ღილაკი ნომერით. როდესაც დააჭერთ შექმნილ ღილაკს, ის წაიშლება. წაშლა უნდა მუშაობდეს სწორად (არა ინდექსით, არამედ უნიკალური იდენტიფიკატორით).

jsx import React, { useState } from 'react';

function AddButtons() { const [buttons, setButtons] = useState([]); const [counter, setCounter] = useState(1);

const addButton = () => { setButtons(prev => [...prev, { id: Date.now(), number: counter }]); setCounter(prev => prev + 1); };

const removeButton = (id) => { setButtons(prev => prev.filter(button => button.id !== id)); };

return ( <div> <button onClick={addButton}>Add</button> <div style={{ marginTop: '10px' }}> {buttons.map(button => ( <button key={button.id} onClick={() => removeButton(button.id)}> {button.number} </button> ))} </div> </div> ); }

export default AddButtons;

В этом компоненте при нажатии на кнопку "Add" создаётся новая кнопка с уникальным `id` и порядковым номером. При нажатии на любую из созданных кнопок она удаляется по уникальному `id`, что предотвращает ошибки при удалении по индексу.