Зміст курсу
Опановуємо 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.
Дякуємо за ваш відгук!