useState директивасы эмне үчүн колдонулат?

useState — бул Reactтин хук, ал функциялык компоненттерге абал кошууга мүмкүндүк берет. Ал эки элементтен турган массивти кайтарат: учурдагы абалдын мааниси жана аны жаңыртуу үчүн функция. Жаңыртуу функциясы чакырылганда, компонент жаңы мааниге кайра иштелип чыгат.

Колдонуу мисалы:

import { useState } from 'react';

function Counter() {
  // 'count' — учурдагы абал, 'setCount' — анын жаңыртуу функциясы
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>Санаачы: {count}</p>
      <button onClick={() => setCount(count + 1)}>
        Өсүү
      </button>
    </div>
  );
}

Негизги өзгөчөлүктөрү:

• Абалды кошуу: Бул функциялык компоненттерде абалды колдонууга мүмкүндүк берет, мурда гана класстарда бар болчу.
• Жаңыртуу функциясы: Специальдуу функцияны кайтарат, ал абалды өзгөртүү үчүн.
• Кайра иштетүү: Абалды жаңыртуу аркылуу өзгөртүү компоненттин кайра иштетилишин камсыздайт.
• Примитивдер жана объекттер: Ар кандай маалымат түрлөрүн сактай алат: сандар, саптар, булеан, объекттер, массивдер.
• Күйгүзүү ленив: Баштапкы мааниси функция болушу мүмкүн, ал биринчи иштетүүдө гана ишке ашат, бул кымбат эсептөөлөр үчүн пайдалуу.

const [data, setData] = useState(() => {
  // Кымбат эсептөөлөр гана бир жолу ишке ашат
  const initialData = someExpensiveCalculation();
  return initialData;
});