상태를 사용하는 적절한 방법은 무엇입니까 소품

Question

반응 구성 요소에 데이터를 처리하는 방법을 알아 내려는 시도.

A) 국가 방법

componentWillReceiveProps(nextProps) { 
if (!nextProps.allPostsQuery.loading && !nextProps.allPostsQuery.error) { 
    this.setState({ 
    postList: nextProps.allPostsQuery.allPosts, 
    }) 
} 
} 

render() { 
    return (
     <FlatList data={this.state.postList}> 
    ) 
} 

B) 소품 방법

render() { 
    return (
     <FlatList data={this.props.allPostQuery.data}> 
    ) 
} 

어떤 제안하는 온/이유 :

임 실제로이 두 가지 방법을 시도?

Answer 1

아폴로 - 클라이언트 태그 때문에 GraphQL에서 요청을 구현했다고 상상해보십시오. Redux를 구현하지 않는다면 렌더링 방법이 트리거되기 때문에 구성 요소를 새로 고치는 것이 좋습니다. 이미 Redux가 있다면, 데이터가 전역 상태로 바뀔 때 렌더링 방법이 트리거되기 때문에 props way가 가장 좋은 방법입니다.

Answer 2

당신은 방금 소품 방식을 직접 사용할 수 있습니다. apollo-client를 사용하고 있기 때문에, 이미 redux 상점에 저장되어 있습니다. 따라서 모든 구성 요소의 데이터에 업데이트가있을 때마다이 구성 요소에서 데이터를 수신하므로 자동으로 다시 렌더링됩니다.