Источник: Nuances of Programming Одна из полезных особенностей React  —  абстрагирование от сложного взаимодействия с объектной моделью документа (DOM, Document Object Model). Вместо того чтобы запрашивать элементы, пытаться добавить к ним классы и устранять несоответствия браузера, можно просто писать компоненты, сосредоточившись на взаимодействии с пользователем. Однако иногда все же появляется необходимость в доступе к реальному DOM. И здесь самое важное  —  разобраться в особенностях Ref и его окружения, научиться их правильно использовать...

Привет друг! В этой статье попробуем реализовать компонент - индикатор загрузки для отправленного документа с клиента. Чего мы хотим добиться? тут 🥸. И так - поехали !🛼 Накидаем сходу немного стилей. И спрячем input type="file", отрисовав вместо него кнопку - 'Выбрать файл'. Подготовим состояние для сохранения файла. import {ChangeEvent, FC, useRef, useState} from 'react'; export const FileUpload = () => { const [selectedFile, setSelectedFile] = useState<File | null>(null); const inputRef...