I’m following the tutorial, but getting TypeError: Cannot read property ‘items’ of undefined after…
Esau Silva
1

Hi Esau,

I had a similar issue. Is the following graphql query that Nadir has given us try adding the following line of code:

items: props.data.listIceCreams ? props.data.listIceCreams.items : [],

GraphQL before adding the line :

export default compose(
graphql(ListIceCreams, {
options: data => ({
fetchPolicy: 'cache-and-network'
}),
props: props => ({
onSearch: searchQuery => {
return props.data.fetchMore({
query: searchQuery === '' ? ListIceCreams : SearchIceCreams,
variables: {
searchQuery
},
updateQuery: (previousResult, { fetchMoreResult }) => ({
...previousResult,
listIceCreams: {
...previousResult.listIceCreams,
items: fetchMoreResult.listIceCreams.items
}
})
})
},
data: props.data
})
})
)(App);

GraphQL after adding the line :

export default compose(
graphql(ListIceCreams, {
options: data => ({
fetchPolicy: 'cache-and-network'
}),
props: props => ({
          //added the line below
items: props.data.listIceCreams ? props.data.listIceCreams.items : [],
                                                                onSearch: searchQuery => {
return props.data.fetchMore({
query: searchQuery === '' ? ListIceCreams : SearchIceCreams,
variables: {
searchQuery
},
updateQuery: (previousResult, { fetchMoreResult }) => ({
...previousResult,
listIceCreams: {
...previousResult.listIceCreams,
items: fetchMoreResult.listIceCreams.items
}
})
})
},
data: props.data
})
})
)(App);
Like what you read? Give Michael Chambers a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.