Reputation: 85
I am trying to implement pagination using relay in application. Displaying data in react-bootstrap table and pagination to navigate pages. First time when I hit page it loads first page data (executes root Query). On click event of on pagination (1, 2, 3 ..) I request server for next page data. as expected root query executes and fetches data But data on UI is not getting updated.. and in browser console I can see following error
Warning: Relay was unable to reconcile edges on a connection. This most likely occurred while trying to handle a server response that includes connection edges with nodes that lack an id
field.
After pagination click I can see changes in url with required parameters say pageNum=2 and on page refresh it shows new data.. but data should come without page refresh.
Upvotes: 3
Views: 557
Reputation: 880
In your server-side GraphQL schema definition where you define the connections for your GraphQL types, did you define field :id, !types.ID
or globalIdField
.
E.g. (in Javascript, but applicable to other languages)
var myObjectType = new GraphQLObjectType({
name: 'MyObject',
description: 'My Object',
fields: () => ({
id: globalIdField('MyObject'),
...
})
})
var myObjectListType = new GraphQLObjectType({
name: 'MyObjectList',
description: 'List of My Objects',
fields: () => ({
id: globalIdField('MyObjectList'),
denims: {
type: myObjectConnection,
...
}
})
})
var {connectionType: myObjectConnection} =
connectionDefinitions({name: 'MyObject', nodeType: myObjectType});
Possibly related to: Nested fragment data always the same in Relay
Upvotes: 2