Reload Modern, Load More 더 이상 작동하지 않습니다. hasMore()가 false를 반환합니다.

Question

loadMore 튜토리얼을 따라 가면서 load가 더 이상 작동하지 않을 때까지, 이제 막 expo를 사용하여 RN에서 작업하고 있습니다. hasMore (내 hasNextPage 사실 반면) 함수는 false를 반환

이

는이 내 내부 목록의 하위 구성 요소

내 집

import Expo from 'expo'; 
import React, {Component} from 'react'; 
import { 
    View, 
    Text, 
    ActivityIndicator, 
    FlatList, 
    TouchableOpacity 
} from 'react-native'; 

import { 
    Button 
} from 'react-native-elements'; 

import { 
    QueryRenderer, 
    createPaginationContainer, 
    graphql 
} from 'react-relay'; 

import environment from '../createRelayEnvironment'; 
import DummyList from '../component/dummyList'; 

class Home extends Component { 

    render() { 
    return(
     <QueryRenderer 
     environment={environment} 
     query={graphql` 
      query homeQuery(
      $count: Int! 
      $cursor: String! 
     ) { 
      viewer { 
       ...dummyList_viewer 
      } 
      } 
     `} 
     variables= {{ 
      count: 5, 
      cursor: '' 
      } 
     } 
     render={({error, props, retry}) => { 
      if(props){ 
      return(
       <DummyList {...props} /> 
      ); 
      } 

      return(
      <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}> 
       <ActivityIndicator size="large" /> 
      </View> 
     ); 
     }} 
     /> 
    ); 
    } 
} 

export default Home; 

입니다 안에 내 홈 화면은 레코드 목록을 가지고

```

import Expo from 'expo'; 
import React, {Component} from 'react'; 
import { 
    View, 
    Text, 
    FlatList, 
    TouchableOpacity 
} from 'react-native'; 

import { 
    createPaginationContainer, 
    graphql 
} from 'react-relay'; 

class DummyList extends Component { 
    renderItem(item) { 
    return(
     <View style={{padding: 10}}> 
     <Text key={item.node.id}>{item.node.title}</Text> 
     </View> 
    ); 
    } 

    _loadMore() { 
    console.log('this.props.relay.hasMore()', this.props.relay.hasMore()); 
    if(!this.props.relay.hasMore() || this.props.relay.isLoading()){ 
     return; 
    } 

    this.props.relay.loadMore(
     10, 
     e => { 
     console.log('e', e); 
     } 
    ) 
    } 

    render() { 
    console.log('apa aja nih props-nya', this.props); 
    return(
     <View> 
     <FlatList 
      data={this.props.viewer.allDummies.edges} 
      renderItem={({item}) => this.renderItem(item)} 
      keyExtractor={(item, index) => item.node.id} 
     /> 
     <TouchableOpacity style={{padding: 10}} onPress={() => this._loadMore()}> 
      <Text>Load More</Text> 
     </TouchableOpacity> 
     </View> 
    ) 
    } 
} 

export default createPaginationContainer(
    DummyList, 
    { 
    viewer: graphql` 
     fragment dummyList_viewer on viewer { 
     allDummies(first: $count, after: $cursor) @connection(key: "DummyList_allDummies"){ 
      pageInfo{ 
      hasNextPage 
      } 
      edges{ 
      cursor 
      node { 
       id 
       title 
      } 
      } 
     } 
     } 
    ` 
    }, 
    { 
    direction: 'forward', 
    getConnectionFromProps(props) { 
     console.log('getConnectionFromProps props', props); 
     return props.viewer; 
     // return props.user && props.user.feed; 
    }, 
    getFragmentVariables(prevVars, totalCount) { 
     return { 
     ...prevVars, 
     count: totalCount 
     } 
    }, 
    getVariables(props, { count, cursor }, fragmentVariables) { 
     return { 
     count, 
     cursor 
     } 
    }, 
    query: graphql` 
     query dummyListQuery(
     $count: Int! 
     $cursor: String 
    ){ 
     viewer{ 
      ...dummyList_viewer 
     } 
     } 
    ` 
    } 
); 

```

난 내 hasMore()가 false를 반환 유지 이유를 찾을 수 없습니다, 난 참고로 1000 개 개의 레코드를 가지고 있고, 처음에로드 5

Answer 1

동일한 문제가 발생했습니다. this.props.relay.hasMore()은 항상 false를 반환합니다. 나는 명시 적으로 쿼리 을 모두pageInfo에 추가 했으므로 이제는 사실대로 반환됩니다.

pageInfo { 
    endCursor 
    hasNextPage 
    hasPreviousPage 
    startCursor 
} 

문서가 정확하지 않거나 구현과 동기화되지 않았습니다. 또한 pageInfo을 조각에 추가하지 않으면 서버 에 대한 쿼리가에 포함되어 pageInfo 필드가 포함되어 있으므로이 문제는 아마도 페이지 매김 컨테이너의 BUG입니다.