Публикации по теме 'render-props'
Передача элементов в качестве реквизита в React
Золотая середина между взрывом реквизита и рендерингом реквизита
В этой истории мы увидим простую технику, которая позволяет вам писать удобные настраиваемые компоненты с простыми API, просто используя базовые строительные блоки React: элемент .
По моему опыту, опытный программист на React естественным образом использует эту технику, но новичку сложно ее понять. Если вы первый, я не буду тратить ваше время зря. Эта история для последних.
реквизит взрыва? А?
Под «взрывом» props..
Рендеринг реквизита в React JS (часть 2)
Это вторая часть статьи, я буду обсуждать предварительную тему о renderProps . Тема: «получить доступ к renderProps компоненту state из вызванного компонента и расширить view компонента renderProps из вызванного компонента.
Если вы понятия не имеете о renderProps . вы можете прочитать мою первую часть этой статьи, чтобы узнать об основах понимания реквизитов рендеринга, по ссылке ниже.
Визуализация реквизита в React JS (часть 1) Иногда нам как..
Как избежать проп-бурения в React
Итак, мы все знаем, что React - отличный фреймворк, он следует архитектуре на основе компонентов, он поощряет подъем состояния, разбивает ваш пользовательский интерфейс на небольшие компоненты и передает данные сверху вниз с помощью свойств.
Это хороший подход к созданию пользовательского интерфейса, поскольку он способствует лучшему повторному использованию кода и делает ваше приложение более предсказуемым и более простым для тестирования. Однако здесь есть одна оговорка.
Когда вы..
Render Props - путь к успеху
Привет, товарищи-разработчики,
Я вернулся к другой интересной теме в ReactJS, которая в основном неизвестна или мало используется, но имеет большие гибкости на ходу.
И да, как сказано в заголовке, это « Render Props » в ReactJS.
Термин рендеринг опоры относится к методике совместного использования кода между компонентами React с использованием опоры, значение которой является функцией.
Как указано в определении, несколько компонентов, использующих один и тот же блок кода,..
Возврат другого компонента через Render Props
"Перейти к содержанию"
Допустим, вы отправляете кнопку от родителя к дочернему элементу, используя реквизиты рендеринга. Как правильно отобразить и разместить возвращаемую кнопку?
Как оказалось, это совсем несложно.
Допустим, это ваш компонент, который использует реквизиты рендеринга для возврата как состояния переключения, так и кнопки переключения.
const React = require('react');
class ToggleProvider extends React.Component{
constructor(){
super();
this.state =..
Простой способ присвоить ярлыкам имена и создать уникальные ключи.
Рассказ о специальных возможностях, ключах, идентификаторах и согласовании.
В мире React есть две вещи, которые всегда трудно сделать, всегда забывают или делают неправильно.
Этикетки для входов. И они очень важны для удобства использования, для UX. Правильная key опора для сопоставленных компонентов React. Не используйте индексы.
Доступность для этикеток
Ввод HTML есть везде. У каждого сайта есть форма, и каждая форма строится из входных данных. A11y требует, чтобы вы..
Повысьте возможность повторного использования кода с помощью шаблона Render Prop в React
Если вы разработчик React и работаете с новыми и / или ранее созданными компонентами каждый день, вы, вероятно, начали замечать шаблоны повторяющейся логики в своем коде. Это может быть так же просто, как создание нескольких функций в одном компоненте для изменения разных ключей состояния, или это может быть в масштабе создания нескольких компонентов, которые являются немного разными версиями одного и того же. Этот пост будет посвящен решению последнего и рефакторингу переключаемого..
