Sobes.tech
Middle
41

პრაქტიკული დავალება: გაუმჯობესეთ React-ის გამრიცხველის კომპონენტი ისე, რომ როდესაც დააჭერთ "ზრდა" ღილაკს, გამრიცხველის მნიშვნელობა გაიზარდოს 1-ით და ისტორიის ჩანაწერში დაემატოს ახალი მნიშვნელობით ჩანაწერი; როდესაც დააჭერთ "ჩემს" — ანალოგიურად; როდესაც დააჭერთ "გადატვირთვა" — ისტორია დაიწერება.

კომპანიებმა სადაც სთხოვეს
А7-Технологии

პასუხი AI-სგან

sobes.tech AI

Вот пример компонента React, реализующего счётчик с историей изменений и кнопками «Увеличить», «Уменьшить» и «Сбросить»:

import React, { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0);
  const [history, setHistory] = useState([]);

  const increment = () => {
    const newCount = count + 1;
    setCount(newCount);
    setHistory(prev => [...prev, `Увеличено до ${newCount}`]);
  };

  const decrement = () => {
    const newCount = count - 1;
    setCount(newCount);
    setHistory(prev => [...prev, `Уменьшено до ${newCount}`]);
  };

  const reset = () => {
    setCount(0);
    setHistory([]);
  };

  return (
    <div>
      <h2>Счётчик: {count}</h2>
      <button onClick={increment}>Увеличить</button>
      <button onClick={decrement}>Уменьшить</button>
      <button onClick={reset}>Сбросить</button>
      <h3>История:</h3>
      <ul>
        {history.map((entry, index) => (
          <li key={index}>{entry}</li>
        ))}
      </ul>
    </div>
  );
}

export default Counter;