В предыдущей статье мы объяснили, как шаблоны проектирования могут помочь контролировать кодовую базу и поддерживать масштабируемость приложений React.js. Мы выделили некоторые популярные шаблоны проектирования для React.js. Затем мы сосредоточимся на HOC и предоставим пример того, как создать простой HOC, а затем рассмотрим реальные сценарии использования HOC для добавления функций аутентификации или извлечения данных в компонент. Итак, приготовьте свой любимый напиток «если вы..

Redux с опорой рендеринга Мне очень нравится рендеринг реквизита, и я знаю, что redux не предлагает рендеринг-версию connect. Возможно, внутри контекста и в том, как данные распределяются, есть причина, которая мешает нам это сделать. Я не пробовал, это скорее мысленный эксперимент Почему мне нравится рендеринг реквизита Ясно видно, откуда берутся реквизиты Порядок компонентов легче сканировать, чем compose‘d hoc.s Так нельзя просто сделать один? Мне нравится идея..

В последние несколько лет предпочтительными способами совместного использования логики с отслеживанием состояния в React являются компоненты более высокого порядка (HOC) и свойства рендеринга. И HOC, и свойства рендеринга требуют дополнительного компонента в дереве компонентов приложения, и, возможно, они также несколько затрудняют рассуждение об общей логике в коде. Теперь мы можем добавить перехватчики React, чтобы поделиться логикой. Давайте сравним варианты решения сквозных проблем в..

В этой статье мы создадим простой компонент React многократного использования, который отслеживает «Состояние видимости страницы». При создании веб-приложения вы можете столкнуться с ситуациями, когда вам нужно отслеживать текущее состояние видимости приложения. Возможно, вам потребуется воспроизвести / приостановить воспроизведение видео или анимационного эффекта, снизить производительность некоторых задач, требующих высокой производительности, или просто отслеживать поведение..

Здесь у нас есть обычный старый компонент класса React. Ничего особенного в этом нет, верно? У нас есть некоторое состояние, функция с именем handleLoudness, которая вызывает setState, и функция рендеринга, которая возвращает какой-то JSX. Здесь нет ничего особенного, верно? Подождите... а как насчет того, что в возвращаемом значении? this.props.render ? Что бы это могло быть? Похоже, это функция с некоторым аргументом! Но что он может отображать на странице? Введите..

Что такое реквизит для рендеринга? Согласно официальному определению реакции: относится к технике совместного использования кода между компонентами React с использованием реквизита, значением которого является функция. Другими словами, компоненты родительского компонента или компонента-контейнера могут получить доступ к состояниям или функциям дочернего компонента без необходимости передавать туда и обратно реквизиты. Это очень полезно, когда мы знаем, что есть компонент с..