2016-12-02 4 views
0

Я смотрел, как общаться между 2 компонентами ReactJS, которые не разделяют родителя, поэтому это наши только корневые компоненты на странице.Общайтесь между компонентами React без родителя

С помощью Интернета я обнаружил, что Redux - это библиотека, которая должна использоваться, чтобы события были делегированы в хранилище.

Но где это вписывается в историю, если я хочу создать простой компонент, который можно использовать повторно, например кнопку, управляемую из других компонентов?

Каждая кнопка должна иметь свои уникальные события, но я не вижу, как это делается практически.

Я что-то упустил?

+0

Можете ли вы представить примерный сценарий, в котором вы хотите, чтобы дочерние компоненты разного происхождения связывались друг с другом? Или это случай, когда вы пытаетесь просто сделать немой/без гражданства/презентационные компоненты? – Pineda

+0

Я просто хочу сделать презентационные компоненты, а не полное приложение. Например, я хочу создать компонент, допустим, это кнопка, которая имеет несколько свойств, например «enabled». Я хочу, чтобы пользователи устанавливали этот компонент и выставляли API для этой команды, поэтому это свойство «включено» может быть контроллером из любых других компонентов. Это имеет смысл для вас? В JavaScript вы можете ссылаться на элемент управления по его идентификатору и выполнять на нем метод. Я хочу что-то подобное в ReactJS. – Complexity

+0

Думаю, я понимаю. Вы не нуждаетесь в Redux для создания презентационных компонентов, вы можете сделать это, передав соответствующие реквизиты вашему презентационному компоненту. Я добавлю пример в ответ для вас. – Pineda

ответ

0

Да, Redux (или любая государственная библиотека управления) - это путь. В Redux, например, у вас есть два типа компонентов: немые компоненты и компоненты высокого порядка. Компоненты высокого порядка используются для подключения к состоянию Redux (см. react-redux). Таким образом, вы можете реализовать свою кнопку как немой компонент, который никак не зависит от Redux и подключиться к Redux в корневом компоненте.

+0

Я довольно новичок в этом, и теперь я прошу большую услугу, но вы можете сделать простой пример. Например, один компонент, который дважды используется на одной странице, чем каждый из них может управляться отдельно от другого компонента? – Complexity

Смежные вопросы