this.props.next не является функцией InfiniteScroll.onScrollListener, использующей клиент Apollo для React - PullRequest
Новая
       18

this.props.next не является функцией InfiniteScroll.onScrollListener, использующей клиент Apollo для React

0 голосов
/ 25 июня 2019

Я пытаюсь реализовать бесконечный скроллер в моем приложении. Я знаю, что код внутри onLoadMore не совсем корректен, но я не могу отладить событие, потому что onLoadMore не вызывается.

Я получаю следующую ошибку

index.js:282 Uncaught TypeError: this.props.next is not a function at InfiniteScroll.onScrollListener (index.js:282) at InfiniteScroll.<anonymous> (index.js:469)

Есть идеи? 

 class Users extends React.Component {
    render() {
      const skip = 12;
      const limit = 12;

      return (
         <Query query={GET_USERS} variables={{ limit }}>
          {({ error, data: { users }, fetchMore }) => {
           console.log("users", users);

           return  (
             <UserList
               items={users}
               onLoadMore={() =>
                  fetchMore({
                   query: GET_USERS,
                   variables: { limit, skip },
                    updateQuery: (previousResult, { fetchMoreResult }) => {
                     console.log("fetchMoreResult", fetchMoreResult);
                     const previousEntry = previousResult.entry;
                     const newUsers = fetchMoreResult.users;
                     const newCursor = fetchMoreResult.moreComments.cursor;

                     return {
                       cursor: newCursor,
                       entry: {
                         comments: [...newUsers, ...previousEntry.users]
                      },
                      __typename: previousEntry.__typename
                     };
                   }
                 })
               }
             />
           );
        }}
       </Query>
     );
   }
 }


 class UsersList extends React.Component {
   componentDidUpdate() {
     this.attachScrollListener();
   }

  render() {
    const { items = [], onLoadMore } = this.props;
    return (
         <InfiniteScroll
           dataLength={items.length}
           loadMore={onLoadMore}
           hasMore={true}
           loader={<p>Loading...</p>}
         >
           {items.map(user => (
              <Column
               key={user.id}
             >
               <UserCard {...user}> </UserCard>
            </Column>
           ))}
         </InfiniteScroll>
     );
   }
}
...