Зміст курсу
Опановуємо React
Опановуємо React
Челендж: Перемикання Видимості
Завдання
Створіть компонент, який містить кнопку та текстовий абзац. Реалізуйте необхідну логіку з використанням хука useState
для перемикання видимості текстового абзацу при натисканні на кнопку.
Інструкція
Імпортуйте хук
useState
з бібліотеки React.Оголосіть змінну стану з іменем
isVisible
за допомогою хукаuseState
. Ініціалізуйте її значеннямfalse
.Реалізуйте функцію з іменем
toggleVisibility
, яка при виклику перемикає станisVisible
міжtrue
таfalse
.Використовуйте функцію
toggleVisibility
як обробникonClick
для кнопки.
Include an
import
statement to import the appropriate hook from the React library.For this task, we will utilize the
useState
hook as we are managing the state of paragraph visibility.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 beisVisible
.To invoke the
toggleVisibility
function when the button is clicked, assign it as the value for theonClick
attribute of the button.
Дякуємо за ваш відгук!