2016-11-01 6 views
-1

React/Redux로 구동되는 웹 컴포넌트의 앱을 만드는 방법이 궁금합니다. 이 예제 https://github.com/facebook/react/blob/master/examples/webcomponents/index.html은 웹 컴포넌트를 React 컴포넌트에 바인딩하는 방법을 보여줍니다. 그러나 그것은 내가 필요한 것만은 아닙니다. 내 의도는 속성을 통해 제공되는 구성에 따라 특정 동작을하는 x-dataview, x-sidebar, x-panel, x-modal과 같은 "벽돌"컬렉션을 선언하는 것입니다. 게다가 공개 API를 공개합니다.웹 컴포넌트를 빌드하기위한 React/Redux

나는 그들을 React로 활기 차게하고 싶습니다. 따라서 이러한 컬렉션을 만들 때 정적 HTML로 앱을 빌드하고 구성 할 수 있습니다. 따라서 소비자는 HTML 및 노출 된 API를 다루면서 React 소스를 전혀 다룰 필요가 없습니다.

확실히 나는 그런 사용자 지정 요소에 반작용 장착 할 수 있지만, 돌아 오는의 첫 번째 원칙에 위배되는 어떤 웹 구성 요소마다 별도의 돌아 오는 가게의 의미 : 전체 응용 프로그램

"상태를 단일 저장소 내의 개체 트리 에 저장됩니다. "

따라서 React와 Redux의 철학을 위반하지 않고 위에서 설명한 내용을 달성 할 수 있습니까?

+0

아니요. 이해가되지 않습니다. React는 단지 구성 요소가 아니라 전체 가상 DOM을 관리합니다. 이것이 바로 React React를 만드는 것입니다. 각 구성 요소에 대한 새로운 React root를 만드는 것은 모든 React의 이점을 무효화합니다. Redux로 이것을 시도하는 것은 훨씬 덜 유용합니다. HTML 구성 요소에는 그림자 DOM이 있고 React에는 가상 DOM이 있습니다. 지배하려고하는 놈들이 너무 많습니다. React와 Redux는 모두 HTML이나 HTML 구성 요소에서 발견되는 단방향 데이터 흐름으로부터 이점을 얻습니다. 원하는 벽돌은 React 구성 요소이고 Redux는 단일 App에 병합하는 접착제입니다. – DDS

+0

REACT/Redux에서 문서를 읽은 후 비슷한 인상을 받았습니다. 페이스 북이 말한대로 https://facebook.github.io/react/docs/web-components.html "개발자는 웹 컴포넌트에서 React를 사용하거나 React에서 Web Components를 사용하거나 둘 다 자유롭게 사용할 수 있습니다 . " 하지만 React를 여러 뿌리에 붙이는 것은 React 철학에서 느껴집니다 ... –

답변

1

이러한 구성 요소가 서로 완전히 독립적 인 경우 각 구성 요소마다 별도의 Redux 저장소를 만들면됩니다.

이 방법을 사용하면 원하는 구성 요소를 추가/제거 할 수 있으며 견적에서 언급 한 원칙이 계속 적용됩니다. 각 구성 요소를 별도의 응용 프로그램으로 생각할뿐입니다.

구성 요소가 서로 이야기하기를 원하면 구성 요소간에 상점을 공유해야합니다.

관련 문제