Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Челендж: Перемикання Видимості | React Хуки та Контекст
Опановуємо React
course content

Зміст курсу

Опановуємо React

Опановуємо React

4. React в Реальному Світі

Челендж: Перемикання Видимості

Завдання

Створіть компонент, який містить кнопку та текстовий абзац. Реалізуйте необхідну логіку з використанням хука useState для перемикання видимості текстового абзацу при натисканні на кнопку.

Інструкція

  1. Імпортуйте хук useState з бібліотеки React.
  2. Оголосіть змінну стану з іменем isVisible за допомогою хука useState. Ініціалізуйте її значенням false.
  3. Реалізуйте функцію з іменем toggleVisibility, яка при виклику перемикає стан isVisible між true та false.
  4. Використовуйте функцію toggleVisibility як обробник onClick для кнопки.
  1. Include an import statement to import the appropriate hook from the React library.
  2. For this task, we will utilize the useState hook as we are managing the state of paragraph visibility.
  3. To determine the appropriate variable name for the state, observe the function associated with setting the state, which is setIsVisible. Remove the "set" prefix and use a lowercase first letter for the variable name, which should be isVisible.
  4. To invoke the toggleVisibility function when the button is clicked, assign it as the value for the onClick attribute of the button.

Все було зрозуміло?

Секція 3. Розділ 3
We're sorry to hear that something went wrong. What happened?
some-alt