React Native
...
Data objects
1:N Relationship
12 min
relación uno a muchos introducción en el núcleo de muchos backends, encontrarás la capacidad de almacenar datos usando parse, puedes almacenar objetos de datos estableciendo relaciones entre ellos las relaciones de datos estandarizan cómo cada objeto de datos está relacionado o asociado con otros eso puede darte un poder extra al construir y ejecutar consultas complejas hay tres tipos principales de relaciones uno a muchos uno a muchos , donde un objeto puede estar relacionado con muchos otros objetos; uno a uno uno a uno , estableciendo relaciones directas entre dos objetos y solo ellos; muchos a muchos muchos a muchos , que puede crear muchas relaciones complejas entre muchos objetos en esta guía, nos centraremos en la relación más común, la de uno a muchos los backends de almacenamiento de datos generalmente exigirán declaraciones explícitas de estas asociaciones e incluso requerirán que crees, por tu cuenta, tablas relacionales para gestionar su unión parse lo hace automáticamente por ti, eliminando cualquier posibilidad de errores al construir tus relaciones de datos y acelerando tu proceso de modelado de aplicaciones hay dos formas de crear una relación de uno a muchos en parse la primera es usando los parse object parse object pointers, que es la más rápida en tiempo de creación y consulta la segunda es usando arrays arrays que pueden llevar a tiempos de consulta lentos dependiendo de su tamaño debido a este problema de rendimiento, usaremos solo ejemplos de punteros de ahora en adelante en esta guía, implementarás una aplicación de registro de libros en react native que contiene los tres principales tipos de asociaciones de datos aprenderás cómo crear y consultar relaciones de datos de uno a muchos usando tu back4app y react native en cualquier momento, puedes acceder a este proyecto a través de nuestros repositorios de github para revisar los estilos y el código completo repositorio de ejemplo en javascript repositorio de ejemplo en typescript requisitos previos para completar este tutorial, necesitarás una aplicación de react native creada y conectada a back4app si deseas probar/utilizar el diseño de pantalla proporcionado por esta guía, deberías configurar el react native paper react native paper biblioteca objetivo usar la relación uno a muchos de parse para modelar una aplicación de tienda de libros en react native 1 entendiendo la clase libro dado que utilizaremos un ejemplo de aplicación de registro de libros en esta guía, primero necesitas entender cómo están dispuestas las relaciones de objetos en esta base de datos la clase de objeto principal que utilizarás es la libro libro clase, que almacena cada entrada de libro en el registro además, estas son las otras cuatro clases de objeto editorial editorial nombre de la editorial del libro, relación uno a muchos con libro libro género género género del libro, relación uno a muchos con libro libro ten en cuenta que para este ejemplo consideraremos que un libro solo puede tener un género; autor autor autor del libro, relación muchos a muchos con libro libro , ya que un libro puede tener más de un autor y un autor puede tener más de un libro también; isdb isdb número identificador isdb del libro, relación uno a uno con libro libro , ya que este número es único para cada libro aquí hay una representación visual de estas tablas de base de datos para simplificar, asumiremos que cada clase de objeto tiene solo un tipo de cadena nombre nombre atributo ( título título para el libro libro ), aparte de cualquier atributo relacional adicional 2 creando relaciones uno a muchos antes de entrar en este paso, te recomendamos clonar y ejecutar el ejemplo de la aplicación de la biblioteca react native ( repositorio de ejemplo de javascript , repositorio de ejemplo de typescript ) esta aplicación tiene dos pantallas principales una responsable de listar los libros registrados y la otra de crear nuevos libros en el formulario de registro de libros, hay enlaces directos a los otros objetos relacionados, por lo que cuando un usuario elige una opción de editor o género, los campos del formulario contendrán el completo parse object parse object instancia echemos un vistazo al método de creación de libros que se llama al enviar este formulario javascript 1 const createbook = async function () { 2 try { 3 // these values come from state variables linked to 4 // the screen form fields, retrieving the user choices 5 // as a complete parse object, when applicable; 6 const booktitlevalue = booktitle; 7 const bookisbdvalue = bookisbd; 8 // for example, bookpublisher holds the value from 9 // radiobutton group field with its options being every 10 // publisher parse object instance saved on server, which is 11 // queried on screen load via useeffect 12 const bookpublisherobject = bookpublisher; 13 const bookgenreobject = bookgenre; 14 // bookauthors can be an array of parse objects, since the book 15 // may have more than one author 16 const bookauthorsobjects = bookauthors; 17	 18 // creates a new parse object instance 19 let book = new parse object('book'); 20	 21 // set data to parse object 22 // simple title field 23 book set('title', booktitlevalue); 24	 25 // 1 1 relation, need to check for uniqueness of value before creating a new isbd object 26 let isbdquery = new parse query('isbd'); 27 isbdquery equalto('name', bookisbdvalue); 28 let isbdqueryresult = await isbdquery first(); 29 if (isbdqueryresult !== null && isbdqueryresult !== undefined) { 30 // if first returns a valid object instance, it means that there 31 // is at least one instance of isbd with the informed value 32 alert alert( 33 'error!', 34 'there is already an isbd instance with this value!', 35 ); 36 return false; 37 } else { 38 // create a new isbd object instance to create a one to one relation on saving 39 let isbd = new parse object('isbd'); 40 isbd set('name', bookisbdvalue); 41 isbd = await isbd save(); 42 // set the new object to the new book object isbd field 43 book set('isbd', isbd); 44 } 45	 46 // one to many relations can be set in two ways 47 // add direct object to field (parse will convert to pointer on save) 48 book set('publisher', bookpublisherobject); 49 // or add pointer to field 50 book set('genre', bookgenreobject topointer()); 51	 52 // many to many relation 53 // create a new relation so data can be added 54 let authorsrelation = book relation('authors'); 55 // bookauthorsobjects is an array of parse objects, 56 // you can add to relation by adding the whole array or object by object 57 authorsrelation add(bookauthorsobjects); 58	 59 // after setting the values, save it on the server 60 try { 61 await book save(); 62 // success 63 alert alert('success!'); 64 navigation goback(); 65 return true; 66 } catch (error) { 67 // error can be caused by lack of internet connection 68 alert alert('error!', error message); 69 return false; 70 } 71 } catch (error) { 72 // error can be caused by lack of value selection 73 alert alert( 74 'error!', 75 'make sure to select valid choices in publisher, genre and author fields!', 76 ); 77 return false; 78 } 79 };1 const createbook = async function () promise\<boolean> { 2 try { 3 // these values come from state variables linked to 4 // the screen form fields, retrieving the user choices 5 // as a complete parse object, when applicable; 6 const booktitlevalue string = booktitle; 7 const bookisbdvalue string = bookisbd; 8 // for example, bookpublisher holds the value from 9 // radiobutton group field with its options being every 10 // publisher parse object instance saved on server, which is 11 // queried on screen load via useeffect 12 const bookpublisherobject parse object = bookpublisher; 13 const bookgenreobject parse object = bookgenre; 14 // bookauthors can be an array of parse objects, since the book 15 // may have more than one author 16 const bookauthorsobjects \[parse object] = bookauthors; 17	 18 // creates a new parse object instance 19 let book parse object = new parse object('book'); 20	 21 // set data to parse object 22 // simple title field 23 book set('title', booktitlevalue); 24	 25 // 1 1 relation, need to check for uniqueness of value before creating a new isbd object 26 let isbdquery parse query = new parse query('isbd'); 27 isbdquery equalto('name', bookisbdvalue); 28 let isbdqueryresult parse object = await isbdquery first(); 29 if (isbdqueryresult !== null && isbdqueryresult !== undefined) { 30 // if first returns a valid object instance, it means that there 31 // is at least one instance of isbd with the informed value 32 alert alert( 33 'error!', 34 'there is already an isbd instance with this value!', 35 ); 36 return false; 37 } else { 38 // create a new isbd object instance to create a one to one relation on saving 39 let isbd parse object = new parse object('isbd'); 40 isbd set('name', bookisbdvalue); 41 isbd = await isbd save(); 42 // set the new object to the new book object isbd field 43 book set('isbd', isbd); 44 } 45	 46 // one to many relations can be set in two ways 47 // add direct object to field (parse will convert to pointer on save) 48 book set('publisher', bookpublisherobject); 49 // or add pointer to field 50 book set('genre', bookgenreobject topointer()); 51	 52 // many to many relation 53 // create a new relation so data can be added 54 let authorsrelation = book relation('authors'); 55 // bookauthorsobjects is an array of parse objects, 56 // you can add to relation by adding the whole array or object by object 57 authorsrelation add(bookauthorsobjects); 58	 59 // after setting the values, save it on the server 60 try { 61 await book save(); 62 // success 63 alert alert('success!'); 64 navigation goback(); 65 return true; 66 } catch (error) { 67 // error can be caused by lack of internet connection 68 alert alert('error!', error message); 69 return false; 70 } 71 } catch (error) { 72 // error can be caused by lack of value selection 73 alert alert( 74 'error!', 75 'make sure to select valid choices in publisher, genre and author fields!', 76 ); 77 return false; 78 } 79 }; mira cómo el bookpublisherobject bookpublisherobject y bookgenreobject bookgenreobject están configurados para el nuevo libro parse object parse object instancia ve qué tan simple es en parse crear una relación de uno a muchos podrías asignar la instancia del objeto objetivo o un puntero a ella usando el parse object set parse object set método, que toma dos argumentos el nombre del campo y el valor a establecer parse creará una columna de tipo de dato puntero y un enlace directo en tu panel de control para un acceso rápido bajo el capó hacer clic en el valor del puntero del objeto en su panel de control lo llevará a la entrada del objeto referenciado puede parecer una función inofensiva, pero esto hace que la depuración y el seguimiento de errores sean mucho más rápidos que buscarlos manualmente 3 consultando relaciones de uno a muchos consultar objetos relacionados uno a muchos es bastante sencillo, ya que gran parte de ello es manejado por parse eche un vistazo a la función de consulta en la pantalla de lista de registros del libro javascript 1 const querybooks = async function () { 2 // these values come from state variables linked to 3 // the screen query radiobutton group fields, with its options being every 4 // parse object instance saved on server from the referred class, which is 5 // queried on screen load via useeffect; these variables retrievie the user choices 6 // as a complete parse object; 7 const querypublishervalue = querypublisher; 8 const querygenrevalue = querygenre; 9 const queryauthorvalue = queryauthor; 10 const queryisbdvalue = queryisbd; 11	 12 // reading parse objects is done by using parse query 13 const parsequery = new parse query('book'); 14	 15 // one to many queries 16 if (querypublishervalue !== '') { 17 parsequery equalto('publisher', querypublishervalue); 18 } 19 if (querygenrevalue !== '') { 20 parsequery equalto('genre', querygenrevalue); 21 } 22	 23 // one to one query 24 if (queryisbdvalue !== '') { 25 parsequery equalto('isbd', queryisbdvalue); 26 } 27	 28 // many to many query 29 // in this case, we need to retrieve books related to the chosen author 30 if (queryauthorvalue !== '') { 31 parsequery equalto('authors', queryauthorvalue); 32 } 33	 34 try { 35 let books = await parsequery find(); 36 // many to many objects retrieval 37 // in this example we need to get every related author parse object 38 // and add it to our query result objects 39 for (let book of books) { 40 // this query is done by creating a relation and querying it 41 let bookauthorsrelation = book relation('authors'); 42 book authorsobjects = await bookauthorsrelation query() find(); 43 } 44 setqueriedbooks(books); 45 return true; 46 } catch (error) { 47 // error can be caused by lack of internet connection 48 alert alert('error!', error message); 49 return false; 50 } 51 };1 const querybooks = async function () promise\<boolean> { 2 // these values come from state variables linked to 3 // the screen query radiobutton group fields, with its options being every 4 // parse object instance saved on server from the referred class, which is 5 // queried on screen load via useeffect; these variables retrievie the user choices 6 // as a complete parse object; 7 const querypublishervalue parse object = querypublisher; 8 const querygenrevalue parse object = querygenre; 9 const queryauthorvalue parse object = queryauthor; 10 const queryisbdvalue parse object = queryisbd; 11	 12 // reading parse objects is done by using parse query 13 const parsequery parse query = new parse query('book'); 14	 15 // one to many queries 16 if (querypublishervalue !== '') { 17 parsequery equalto('publisher', querypublishervalue); 18 } 19 if (querygenrevalue !== '') { 20 parsequery equalto('genre', querygenrevalue); 21 } 22	 23 // one to one query 24 if (queryisbdvalue !== '') { 25 parsequery equalto('isbd', queryisbdvalue); 26 } 27	 28 // many to many query 29 // in this case, we need to retrieve books related to the chosen author 30 if (queryauthorvalue !== '') { 31 parsequery equalto('authors', queryauthorvalue); 32 } 33	 34 try { 35 let books \[parse object] = await parsequery find(); 36 // many to many objects retrieval 37 // in this example we need to get every related author parse object 38 // and add it to our query result objects 39 for (let book of books) { 40 // this query is done by creating a relation and querying it 41 let bookauthorsrelation = book relation('authors'); 42 book authorsobjects = await bookauthorsrelation query() find(); 43 } 44 setqueriedbooks(books); 45 return true; 46 } catch (error) { 47 // error can be caused by lack of internet connection 48 alert alert('error!', error message); 49 return false; 50 } 51 }; en este caso, para consultar cualquier libro relacionado con un editor o género específico, solo necesitas realizar un parse query equalto parse query equalto método pasando la parse object parse object instancia como parámetro después de consultar, parse almacenará dentro de los objetos resultantes las instancias completas de cualquier campo relacional de uno a muchos para recuperar y mostrar datos de estas instancias de objeto, puedes encadenar el parse object get parse object get método así bookparseobject get(('publisher') get('name') bookparseobject get(('publisher') get('name') aquí está cómo se ve la pantalla de lista al usar estos getters para recuperar los nombres del editor y del género de los elementos de la lista conclusión al final de esta guía, aprendiste cómo crear y consultar relaciones de uno a muchos en parse en react native en la próxima guía, te mostraremos cómo hacer consultas y relaciones de muchos a muchos y de uno a uno