Хук useState в React.js

В библиотеке React для создания интерфейсов, существуют специальные функции, называемые "хуками". Хуки добавляют возможность использовать состояние и другие возможности React без написания классов. Один из таких функций - это useState, является ответом на вопрос квиза.

useState - это хук, который позволяет добавить состояние реакт-компонента. Это особенно полезно при работе с функциональными компонентами в React. Он принимает начальное значения состояния как аргумент и возвращает массив, первый элемент которого является текущим значением, а второй элемент - функция для обновления этого значения.

Рассмотрим использование useState на примере счетчика:

import React, { useState } from 'react';

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

    return (
        <div>
            <p>Вы кликнули {count} раз</p>
            <button onClick={() => setCount(count + 1)}>
                Нажми на меня
            </button>
        </div>
    );
}
    
export default Counter;

Здесь мы определили состояние count со значением по умолчанию 0 и функцию setCount для его обновления. Эта функция используется в обработчике onClick кнопки, чтобы увеличить значение count на один каждый раз, когда происходит клик.

Важно помнить, что при каждом рендере создаются новые count и setCount, а useState гарантирует, что count будет иметь последнее обновленное значение.

Таким образом, useState является мощным инструментом для создания интерактивных интерфейсов в React с использованием функциональных компонентов.