API 데이터를 React 구성 요소에 전달하려면 어떻게해야합니까? (샌드 박스 링크 포함)

내가 잘못 게시하는 경우 사과하겠습니다 만, 글자 그대로 9 시간 동안 있었으므로 트래픽이 발생할 준비가되었습니다. https://codesandbox.io/s/github/reactjs/redux/tree/master/examples/real-world API 데이터를 React 구성 요소에 전달하려면 어떻게해야합니까? (샌드 박스 링크 포함)

내 포크는 여기에 있습니다 : : https://codesandbox.io/s/wkq867jwll

실제 예제 데이터를로드 경로 변경을

나는 현실 세계가 + 돌아 오는 응용 프로그램은 여기에서 찾을 반작용 갈래. 그 대신 내 포크는 "Go!"를 클릭 할 때 데이터를로드합니다. 단추. 로드하는 것이 좋으며 데이터가 올바르게 표준화되어 있으며 예상대로 state.entities.artifacts에 나타납니다.

마지막으로 남은 문제는 표시 할 항목을 state.entities.artifacts에 표시해야하는 List 구성 요소를 가져올 수 없다는 것입니다. API에서 다시 검색 결과를 얻은 후에도 렌더링을 다시 시도하지 않습니다.

필자는 내가 React와 Redux에 완전히 익숙하다는 사실에 뿌리 자고, 문자 그대로 책상 위에서 머리를 두드렸다.

:(같은 문제가있어 다른 사람들을위한

출처

2017-12-11 bosscube

redux 상태를 구성 요소에 올바르게 연결하여 문제를 해결했습니다. 미래의 지식 습득자를 위해 솔루션을 설명하는 질문에 대한 답을 추가하십시오. :) – jered

감사합니다. @ 도움이 필요했습니다! 나는 명백하게 내일까지 나의 대답을 받아 들일 수 없다. 그러나 나는 그렇게 할 것이다. – bosscube

또한 페이지 매김 설정을위한 다른 티켓을 열 것입니다. 그 어떤 경험? – bosscube

, 대답은과 같이, mapStateToProps를 통해 소품에 내 항목 (state.entities.artifacts)를지도했다 :

const mapStateToProps = (state, ownProps) => ({ 
    artifacts: state.entities.artifacts, 
    ... 
});

그리고 다음을 I 다음과 같은 구성 요소에서 사용할 수 있습니다.

<List 
    config={searchConfig} 
    artifacts={artifacts} 
    totalResults={totalResults} 
/>

이 작동 방식에 대한 전체 예제는 내 sa를 참조하십시오. ndbox at : https://codesandbox.io/s/wkq867jwll

감사합니다!

출처

2017-12-12 20:02:30 bosscube

API 데이터를 React 구성 요소에 전달하려면 어떻게해야합니까? (샌드 박스 링크 포함)

답변

관련 문제