reactjs - descargar - En Relay, ¿qué papel juegan la interfaz de nodo y la especificación de ID global?

relay modern

Question

Comencé con el relay-starter-kit y también trabajé en la documentación de Relay y GraphQL. Pero hay bastantes áreas que son inexplicables y misteriosas.

En serio, leí muchas documentaciones en todas partes sobre todas estas cosas, pero no pude encontrar ninguna explicación satisfactoria para las siguientes preguntas:

¿Para qué es esto? Puse el registro pero nunca se llama en absoluto:

var {nodeInterface, nodeField} = nodeDefinitions(
(globalId) => {
var {type, id} = fromGlobalId(globalId);
if (type === ''User'') {
return getUser(id);
} else if (type === ''Widget'') {
return getWidget(id);
} else {
return null;
}
},
(obj) => {
if (obj instanceof User) {
return userType;
} else if (obj instanceof Widget) {
return widgetType;
} else {
return null;
}
}
);

Y cuál es el efecto real de esto:

interfaces: [nodeInterface],

Quizás relacionado con eso, ¿qué hace el campo de node aquí:

var queryType = new GraphQLObjectType({
name: ''Query'',
fields: () => ({
node: nodeField,
// Add your own root fields here
viewer: {
type: userType,
resolve: () => getViewer(),
},
}),
});

¿Y cuál es la magia alrededor del campo de id ? ¿ globalIdField qué sirve globalIdField ?

Tengo una id en mi base de datos y pensé que podría usarla en mis objetos GraphQL:

En lugar de:

id: globalIdField(''User''),

Quiero usar mi id de base de datos:

id: {
type: GraphQLID,
description: ''The identifier''
},

Pero si hago eso, RelayQueryWriter: Could not find a type name for record ''1'' un error en el navegador que dice RelayQueryWriter: Could not find a type name for record ''1'' .

Puedo deshacerme de ese error agregando __typename a la consulta de retransmisión de mis contenedores de componentes, pero parece que todo está mal.

Sería genial si pudieras dar algunos detalles más profundos y una mejor explicación aquí y mejorar la documentación oficial.

Gracias

Answer 1

El campo raíz Node , en combinación con IDs únicos a nivel mundial, entra en juego cuando Relay necesita recuperar un objeto. La recuperación se produce cuando llama a this.props.relay.forceFetch() o cuando agrega campos a la consulta para un objeto cuyo ID global se conoce porque ya se ha recuperado parcialmente.

En casos como estos, Relay hará un corto circuito en la consulta regular y ejecutará una consulta para los objetos directamente usando su ID global y la llamada raíz del node .

Ejemplo :

Suponga que $showComments era false cuando esta consulta se resolvió por primera vez.

query {
viewer {
stories(first: 10) {
edges {
node {
id,
comments(first: 10) @include(if: $showComments) {
author,
commentText
}
text,
}
}
}
}
}

Esto habrá provocado una búsqueda de id y text para algunas historias, cuyas identificaciones ahora se conocen.

Imagine que en algún momento futuro, la variable $showComments hizo true . La retransmisión volverá a capturar solo los datos que necesita utilizando el campo raíz del node .

query {
node(id: "ABC123") {
fragment on Story { comments(first: 10) { author, commentText } }
}
node(id: "DEF456") {
fragment on Story { comments(first: 10) { author, commentText } }
}
node(id: "GHI789") {
fragment on Story { comments(first: 10) { author, commentText } }
}
...
}

Esto depende de algunas piezas:

1. Cada objeto debe tener una ID globalmente única o estar identificado por un par de tipo / ID (el asistente globalIdField hace y produce una cadena codificada en base64).
2. El servidor debe saber cómo resolver un objeto a partir de una ID única global y viceversa. Para esto son las nodeDefinitions .
3. Cualquier objeto que espera ser recuperable usando este sistema debe implementar el nodeInterface .

Ver también: https://facebook.github.io/relay/docs/graphql-object-identification.html#content