React Native
...
Data objects
1:N Relationship
10 นาที
ความสัมพันธ์แบบหนึ่งต่อหลาย บทนำ ที่แกนกลางของแบ็กเอนด์หลายๆ ตัว คุณจะพบความสามารถในการจัดเก็บข้อมูล โดยใช้ parse คุณสามารถจัดเก็บวัตถุข้อมูลที่สร้างความสัมพันธ์ระหว่างกัน ความสัมพันธ์ของข้อมูลจะทำให้มาตรฐานว่าแต่ละวัตถุข้อมูลมีความสัมพันธ์หรือเชื่อมโยงกับวัตถุอื่นๆ อย่างไร ซึ่งสามารถให้พลังเพิ่มเติมเมื่อสร้างและรันคำสั่งค้นหาที่ซับซ้อน มีประเภทความสัมพันธ์หลักสามประเภท หนึ่งต่อหลาย หนึ่งต่อหลาย , ซึ่งวัตถุหนึ่งสามารถเชื่อมโยงกับวัตถุอื่นๆ ได้หลายวัตถุ; หนึ่งต่อหนึ่ง หนึ่งต่อหนึ่ง , สร้างความสัมพันธ์โดยตรงระหว่างสองวัตถุและเฉพาะพวกเขาเท่านั้น; หลายต่อหลาย หลายต่อหลาย , ซึ่งสามารถสร้างความสัมพันธ์ที่ซับซ้อนมากมายระหว่างวัตถุหลายๆ ตัว ในคู่มือนี้ เราจะมุ่งเน้นไปที่ความสัมพันธ์ที่พบบ่อยที่สุด คือ ความสัมพันธ์แบบหนึ่งต่อหลาย แบ็กเอนด์การจัดเก็บข้อมูลมักจะต้องการการประกาศความสัมพันธ์เหล่านี้อย่างชัดเจน และแม้กระทั่งต้องการให้คุณสร้างตารางความสัมพันธ์ด้วยตัวเองเพื่อจัดการการเชื่อมโยงของพวกเขา parse ทำให้มันเป็นอัตโนมัติสำหรับคุณ โดยการกำจัดความเป็นไปได้ของข้อผิดพลาดในขณะที่สร้างความสัมพันธ์ข้อมูลของคุณและเร่งกระบวนการสร้างโมเดลแอปพลิเคชันของคุณ มีสองวิธีในการสร้างความสัมพันธ์แบบหนึ่งต่อหลายใน parse วิธีแรกคือการใช้ parse object parse object พอยเตอร์ ซึ่งเป็นวิธีที่เร็วที่สุดในด้านการสร้างและเวลาค้นหา วิธีที่สองคือการใช้ arrays arrays ซึ่งอาจทำให้เวลาค้นหาช้า ขึ้นอยู่กับขนาดของมัน เนื่องจากปัญหาด้านประสิทธิภาพนี้ เราจะใช้เฉพาะตัวอย่างพอยเตอร์ตั้งแต่ตอนนี้เป็นต้นไป ในคู่มือนี้ คุณจะสร้างแอปพลิเคชันการลงทะเบียนหนังสือด้วย react native ที่มีการเชื่อมโยงข้อมูลหลักสามประเภท คุณจะได้เรียนรู้วิธีการสร้างและค้นหาความสัมพันธ์ข้อมูลแบบหนึ่งต่อหลายโดยใช้ back4app และ react native ในทุกเวลา คุณสามารถเข้าถึงโครงการนี้ได้ผ่านทาง github ของเราเพื่อตรวจสอบสไตล์และโค้ดที่สมบูรณ์ ที่เก็บตัวอย่าง javascript ที่เก็บตัวอย่าง typescript ข้อกำหนดเบื้องต้น ในการทำตามบทแนะนำนี้ คุณจะต้องมี แอป react native ที่สร้างขึ้นและเชื่อมต่อกับ back4app หากคุณต้องการทดสอบ/ใช้เลย์เอาต์หน้าจอที่จัดเตรียมโดยคู่มือนี้ คุณควรตั้งค่า react native paper react native paper ไลบรารี เป้าหมาย ใช้ความสัมพันธ์แบบหนึ่งต่อหลายของ parse เพื่อสร้างแบบจำลองแอป book store react native 1 การเข้าใจคลาสหนังสือ เนื่องจากเราจะใช้ตัวอย่างแอปพลิเคชันการลงทะเบียนหนังสือในคู่มือนี้ คุณต้องเข้าใจก่อนว่าความสัมพันธ์ของวัตถุถูกจัดเรียงอย่างไรในฐานข้อมูลนี้ คลาสวัตถุหลักที่คุณจะใช้คือ หนังสือ หนังสือ ซึ่งเก็บข้อมูลการลงทะเบียนหนังสือแต่ละเล่ม นอกจากนี้ยังมีคลาสวัตถุอีกสี่คลาสดังนี้ ผู้จัดพิมพ์ ผู้จัดพิมพ์ ชื่อผู้จัดพิมพ์หนังสือ ความสัมพันธ์แบบหนึ่งต่อหลายกับ หนังสือ หนังสือ ประเภท ประเภท ประเภทหนังสือ ความสัมพันธ์แบบหนึ่งต่อหลายกับ หนังสือ หนังสือ โปรดทราบว่าสำหรับตัวอย่างนี้เราจะพิจารณาว่าหนังสือสามารถมีประเภทเดียวเท่านั้น; ผู้เขียน ผู้เขียน ผู้เขียนหนังสือ ความสัมพันธ์แบบหลายต่อหลายกับ หนังสือ หนังสือ , เนื่องจากหนังสือสามารถมีผู้เขียนได้มากกว่าหนึ่งคนและผู้เขียนสามารถมีหนังสือได้มากกว่าหนึ่งเล่มเช่นกัน; isdb isdb หมายเลขระบุ isdb ของหนังสือ ความสัมพันธ์แบบหนึ่งต่อหนึ่งกับ หนังสือ หนังสือ , เนื่องจากหมายเลขนี้เป็นเอกลักษณ์สำหรับแต่ละเล่ม นี่คือการแสดงภาพของตารางฐานข้อมูลเหล่านี้ เพื่อความเรียบง่าย เราจะสมมติว่าแต่ละคลาสวัตถุมีเพียงประเภทสตริง ชื่อ ชื่อ คุณสมบัติ ( ชื่อเรื่อง ชื่อเรื่อง สำหรับ หนังสือ หนังสือ ), นอกเหนือจากคุณสมบัติสัมพันธ์เพิ่มเติมใดๆ 2 การสร้างความสัมพันธ์แบบหนึ่งต่อหลาย ก่อนที่จะไปยังขั้นตอนนี้ เราขอแนะนำให้คุณโคลนและรันแอปตัวอย่าง react native library ( ที่เก็บตัวอย่าง javascript , ที่เก็บตัวอย่าง typescript ) แอปพลิเคชันนี้มีสองหน้าหลัก หนึ่งหน้าที่รับผิดชอบในการแสดงรายการหนังสือที่ลงทะเบียนและอีกหน้าหนึ่งสำหรับการสร้างหนังสือใหม่ ในแบบฟอร์มการลงทะเบียนหนังสือ จะมีลิงก์โดยตรงไปยังวัตถุที่เกี่ยวข้องอื่นๆ ดังนั้นเมื่อผู้ใช้เลือกตัวเลือกผู้จัดพิมพ์หรือตัวเลือกประเภท ฟิลด์ในแบบฟอร์มจะเก็บ parse object parse object อินสแตนซ์ มาดูวิธีการสร้างหนังสือที่ถูกเรียกเมื่อส่งแบบฟอร์มนี้ 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 }; ดูสิว่า bookpublisherobject bookpublisherobject และ bookgenreobject bookgenreobject ถูกตั้งค่าให้กับหนังสือใหม่ parse object parse object ตัวอย่างนี้ ดูว่ามันง่ายแค่ไหนใน parse ในการสร้างความสัมพันธ์แบบหนึ่งต่อหลาย คุณสามารถกำหนดตัวอย่างวัตถุเป้าหมายหรือชี้ไปที่มันโดยใช้ parse object set parse object set วิธีการ ซึ่งรับสองอาร์กิวเมนต์ ชื่อฟิลด์และค่าที่จะตั้งค่า parse จะสร้างคอลัมน์ประเภทข้อมูลชี้และลิงก์โดยตรงบนแดชบอร์ดของคุณเพื่อการเข้าถึงอย่างรวดเร็วภายใต้พื้นผิว การคลิกที่ค่าชี้วัตถุในแดชบอร์ดของคุณจะพาคุณไปยังรายการวัตถุที่อ้างอิง อาจดูเหมือนเป็นฟีเจอร์ที่ไม่เป็นอันตราย แต่สิ่งนี้ทำให้การดีบักและการติดตามข้อผิดพลาดรวดเร็วยิ่งขึ้นกว่าการค้นหามันด้วยตนเอง 3 การสอบถามความสัมพันธ์แบบหนึ่งต่อหลาย การสอบถามวัตถุที่เกี่ยวข้องแบบหนึ่งต่อหลายเป็นเรื่องที่ค่อนข้างตรงไปตรงมา เนื่องจากส่วนใหญ่จะถูกจัดการโดย parse ดูฟังก์ชันการสอบถามในหน้าจอรายการทะเบียนหนังสือ 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 }; ในกรณีนี้ เพื่อค้นหาหนังสือใด ๆ ที่เกี่ยวข้องกับผู้จัดพิมพ์หรือแนวเฉพาะ คุณเพียงแค่ต้องใช้ parse query equalto parse query equalto โดยส่ง parse object parse object เป็นพารามิเตอร์ หลังจากการค้นหา parse จะเก็บอินสแตนซ์ที่สมบูรณ์ของฟิลด์ความสัมพันธ์แบบหนึ่งต่อหลายไว้ในวัตถุที่ได้มา เพื่อดึงข้อมูลและแสดงข้อมูลจากอินสแตนซ์วัตถุเหล่านี้ คุณสามารถเชื่อมต่อ parse object get parse object get เช่นนี้ bookparseobject get(('publisher') get('name') bookparseobject get(('publisher') get('name') นี่คือวิธีที่หน้ารายการดูเหมือนเมื่อใช้ getters เหล่านี้เพื่อดึงชื่อผู้จัดพิมพ์และแนวจากรายการ บทสรุป ในตอนท้ายของคู่มือนี้ คุณได้เรียนรู้วิธีการสร้างและค้นหาความสัมพันธ์แบบหนึ่งต่อหลายใน parse บน react native ในคู่มือต่อไป เราจะแสดงวิธีการทำการค้นหาและความสัมพันธ์แบบหลายต่อหลายและหนึ่งต่อหนึ่ง