2016-07-07 2 views
-1

render 함수에서 이미 사용하기 위해 이미 채워진 상점에있는 데이터를 가져올 수 있습니까? 예를 들어이미 채워진 상점에서 데이터 가져 오기

: 여기에 이미 데이터가있는 상점에서 Layout 구성 요소에 데이터를 보낼 필요가

ReactDOM.render(
    <Provider store={store}> 
     <Layout/> 
    </Provider>, 
    document.getElementById('app') 
    ); 

. 해당 변경 사항이있을 때마다 변경된 데이터를 보낼 수 있습니까?

+0

시도해 보셨습니까? 먼저 'Provider'에 대한 문서를 읽으십시오. –

+0

반응 구성 요소를 저장소의 값에 연결하면 값을 변경하면 구성 요소가 자동으로 다시 렌더링됩니다. http://redux.js.org/docs/basics/UsageWithReact.html을 참조하십시오. – Robin

+0

설명서를 읽었지만 여전히 해결책이 없으며 현재로서는 데이터 컨테이너에서 데이터를 가져 오는 방법을 알고 있습니다. connect()하지만 초기에 채워진 데이터가 필요합니다. 예를 들어 사용자의 양식에서 채워진 레이아웃 데이터가 이미 있어야합니다. 이제 레이아웃 컨테이너로 전달할 값이 필요합니다. –

답변

0

공급자가 저장소를 React 구성 요소 컨텍스트에 둡니다. 그런 다음 구성 요소 정의 (이 경우 레이아웃)에서 @connect 데코레이터를 사용하여 저장소에 연결하고 필요한 데이터를 선택합니다.

연결은 컨텍스트에서 저장소에 액세스하고 변경 내용을 구독하므로 저장소의 데이터가 변경 될 때마다 구성 요소가 다시 렌더링됩니다. 소품을 통해 가게를 지나쳐서는 안됩니다. 나쁜 습관입니다. 연결된 속성을 물론 자식에게는 전달할 수 있지만 완전한 저장소는 전달할 수 없습니다.

스토어에 넣은 초기 데이터는 앱이 DOM에 처음 탑재 될 때 렌더링됩니다. 그 이후의 모든 변경 (사용자 양식 제출)은 상점을 변경시키고 구성 요소는 연결 메커니즘을 통해 갱신됩니다.

Redux 문서는 잘 작성되었습니다. 나는 당신이 그들에 대해 자세히 살펴볼 것을 제안한다. 또한 무료 인 Redux에 대한 많은 자습서가 있습니다 (예 : egghead.io).