---
title: 플러터 SDK에서의 Parse 다대다 관계 구현
slug: docs-kr/flutter/parse-sdk/data-objects/flutter-many-to-many-relationship
description: 플러터 SDK에서 Parse를 사용하여 다대다 관계 설정 및 쿼리하는 방법을 알아보세요.
image: https://www.back4app.com/images/logo-social.png
createdAt: 2024-03-15T15:45:12.640Z
---
# 플러터에서의 다대다 관계
## 소개
이전 가이드에서는 일대다 관계를 사용하는 방법을 배웠고, 프로젝트를 계속 진행할 것입니다. 이번 가이드에서는 가장 일반적인 관계인 다대다에 집중할 것입니다. Parse에서 다대다 관계를 생성하는 방법은 세 가지가 있습니다.
- 첫 번째는 Parse `관계`, 생성 및 쿼리 시간에서 가장 빠릅니다. 이번 가이드에서는 이를 사용할 것입니다.
- 두 번째는`배열`을 사용하는 것입니다. `포인터`의 크기에 따라 쿼리 시간이 느려질 수 있습니다.
- 세 번째는`조인 테이블`을 사용하는 것입니다. 고전 데이터베이스의 아이디어에서 출발합니다. 다대다 관계가 있을 때, 우리는 양쪽의 모든 `objectId` 또는 `포인터`를 결합하여 관계가 추적되는 새로운 별도의 테이블을 만듭니다.
이번 가이드에서는 Parse `다대다` 관계를 플러터 도서 등록 앱에서 구현할 것입니다. `관계`를 사용하여 다대다 데이터 관계를 생성하고 쿼리하는 방법, 그리고 Back4App과 Flutter SDK를 사용하여 관련 객체에서 데이터를 반환하는 쿼리를 수행하는 방법을 배울 것입니다.
::embed[]{url="https://www.youtube.com/embed/Vfyo-g8vjPs"}
## 전제 조건
:::hint{type="info"}
- [안드로이드 스튜디오 ](https://developer.android.com/studio) 또는 [VS 코드 설치](https://code.visualstudio.com/) ( [플러그인](https://docs.flutter.dev/get-started/editor) 다트 및 플러터와 함께)
- **참고: 이전 가이드에서 생성된 플러터 앱**
- 이전 가이드를 완료하여 `일대다 관계` 클래스에 대한 더 나은 이해를 가질 수 있습니다.
- 안드로이드 또는 iOS를 실행하는 장치(또는 가상 장치).
:::
## 1 - 도서 앱 템플릿 실행
이전 가이드를 완료하지 않았다면, 우리 저장소에서 전체 [도서 플러터 앱](https://github.com/templates-back4app/flutter_associations) 프로젝트를 클론하고 실행할 수 있습니다. 또한 [이전 가이드](https://www.back4app.com/docs/flutter/parse-sdk/data-objects/%7Bsite.baseurl%7D%7D//flutter/parse-sdk/data-objects/flutter-one-to-many-relationship)를 살펴보아 앱 템플릿을 더 잘 이해할 수 있습니다. 아래에서 도서 등록 데이터 모델의 시각적 표현을 찾을 수 있습니다.
## 2 - 책 객체와 저자를 저장하기
이전 가이드에서 Flutter 프로젝트를 엽니다 [Flutter의 일대다 관계](https://www.back4app.com/docs//flutter/parse-sdk/data-objects/flutter-one-to-many-relationship). 함수 `doSaveBook`를 파일 `main.dart`, 안에 아래 코드를 넣어 `Future doSaveBook()` 함수로 교체합니다. 이 함수는 Back4app 데이터 저장소에 관계가 있는 새로운 책을 생성합니다.
```dart
1 final book = ParseObject('Book')
2 ..set('title', controllerTitle.text.trim())
3 ..set('year', int.parse(controllerYear.text.trim()))
4 //the objectId will be converted to a Pointer on the save() method
5 ..set('genre', ParseObject('Genre')..objectId = genre.objectId)
6 //you can also convert to a Pointer object before the saving using the .toPointer() method
7 ..set('publisher',
8 (ParseObject('Publisher')..objectId = publisher.objectId).toPointer())
9 //Saving a List of Authors for the Book
10 ..addRelation(
11 'authors',
12 authors
13 .map((o) => ParseObject('Author')..objectId = o.objectId)
14 .toList());
15
16 await book.save();
```
이 함수를 만들기 위해 다음 단계를 따르세요:
- 1\. Parse의 새 인스턴스를 생성합니다.`책` 클래스는 다음 명령으로 생성합니다: `ParseObject('Book')`.
- 2\. 다음을 사용하십시오 `설정` 함수를 사용하여 이 객체의 필드를 설정합니다.
- 2.1.`제목`는 텍스트 컨트롤러로부터 값을 받는 텍스트 속성입니다.
- 2.2.`장르`는 다음을 정의하여 값을 받습니다. `ParseObject`와 함께 `objectId`의 선택된 `장르`. (*Parse는 저장 시 포인터로 변환됩니다.*)
- 2.3.`출판사` 는 다음을 정의하여 값을 받습니다 `ParseObject` 의 `objectId` 선택된 `출판사`. (*Parse에 대해 우리가 *`포인터`*로 저장하고 싶다고 지정할 수 있습니다 *`toPointer()`* 메서드를 사용하여*)
- 2.4.`저자`. 우리는 `addRelation` 메서드를 호출합니다 `ParseObject`, `ParseObject` 목록을 보내며 `objectId`가 선택된 `저자`입니다.
- 3\. 호출하다`저장` 함수는 `ParseObject`, 이는 효과적으로 객체를 Back4app 대시보드의 데이터베이스에 등록합니다.
앱을 실행하고 새로운 `doSaveBook()` 함수를 테스트하세요.
- 먼저, 대시보드에 접근하여 이전 가이드에서 등록된 책들을 삭제합니다.
- 버튼을 클릭합니다.`책 추가`
- 저자와 함께 책 정보를 입력합니다.
- 버튼을 클릭합니다.`책 저장` 버튼
::Image[]{src="https://api.archbee.com/api/optimize/yD3zCY-NNBBIfd0uqcfR5/O0kajxCDCm8k3Q2aBeI_u_image.png" size="30" width="323" height="627" position="center" showCaption="false"}
새 객체가 관계와 함께 데이터베이스에 저장되었는지 확인하려면 `Back4app 대시보드`에 접근하고 `Book` 클래스를 접근하세요.
::Image[]{src="https://api.archbee.com/api/optimize/yD3zCY-NNBBIfd0uqcfR5/lE7tRKvGzi1YioqFBkxZb_image.png" size="30" width="323" height="627" position="center" showCaption="false"}
대시보드에서 객체 포인터/관계 값을 클릭하면 참조된 객체 항목으로 이동합니다. 이는 무해한 기능처럼 보일 수 있지만, 수동으로 검색하는 것보다 디버깅 및 오류 추적을 훨씬 더 빠르게 만듭니다.
## 3 - 관계와 함께 책 세부정보 쿼리하기
이 기능은 Back4app 데이터베이스에서 책 세부정보를 쿼리하여 관계 데이터를 반환합니다. 어떤 상황에서는 하나의 쿼리에서 여러 유형의 관련 객체를 반환하고 싶을 수 있습니다. 이는 `includeObject` 메서드를 사용하여 수행할 수 있습니다. 우리의 예에서는 장르와 출판사 정보를 포함하여 책을 반환하고자 합니다.
함수 `getBookDetail`을(를) 파일 `main.dart`, 다음으로 `getBookDetail(ParseObject book)` 함수 내부의 아래 코드를 교체하세요:
```dart
1 QueryBuilder queryBook =
2 QueryBuilder(ParseObject('Book'))
3 ..whereEqualTo('objectId', book.objectId)
4 ..includeObject(['publisher', 'genre']);
5
6 final ParseResponse responseBook = await queryBook.query();
7
8 if (responseBook.success && responseBook.results != null) {
9 final book = (responseBook.results.first) as ParseObject;
10 bookTitle = book.get('title');
11 bookYear = book.get('year');
12 bookGenre = book.get('genre').get('name');
13 bookPublisher = book.get('publisher').get('name');
14 loadedData = true;
15 }
16
17 QueryBuilder queryAuthors =
18 QueryBuilder(ParseObject('Author'))
19 ..whereRelatedTo('authors', 'Book', book.objectId);
20
21 final ParseResponse responseAuthors = await queryAuthors.query();
22
23 if (responseAuthors.success && responseAuthors.results != null) {
24 bookAuthors = responseAuthors.results
25 .map((e) => (e as ParseObject).get('name'))
26 .toList();
27 }
```
이 함수를 만들기 위해 다음 단계를 따르세요:
1. 인스턴스를 생성합니다.`ParseQuery` 객체를 위해 `Book` 클래스. 쿼리에 조건을 삽입하여 `Books`를 검색합니다. `objectId` 필드가 선택한 책의 `objectId`와 같도록 합니다.
2. 우리는 includeObject 메서드를 사용하여, 같은 쿼리에서 반환할 포인터의 필드를 알립니다: 장르와 출판사. 점 표기법을 사용하여 다단계 includeObject를 수행할 수도 있습니다. 예: \`..includeObject(\[‘post’, ‘post.authors’]);
3. 쿼리의 검색 메서드를 사용하여 `query()` 메서드를 사용합니다.
4. 작업이 성공하면, `Book`의 객체가 반환됩니다.
5. 우리는 get 메서드를 사용하여 데이터를 검색합니다. 포인터인 필드는 먼저 포인터를 검색한 다음 그 데이터를 얻어야 합니다. 예:`bookGenre = book.get('genre').get('name');`
처리의 두 번째 단계에서, 우리는 책과 관련된 저자들을 회수해야 합니다.
이 기능을 구축하려면 다음 단계를 따르세요:
1. 다음의 인스턴스를 생성합니다.`ParseQuery` 객체를 위해 `Authors` 클래스. 쿼리에 조건을 삽입하고, `whereRelatedTo` 연산자를 사용하여 `Authors`와 `Book`의 관계를 검색합니다.`Book`이 `objectId`와 같을 때.
2. 다음의 `query()` 메서드를 사용하여 쿼리를 수행합니다.
3. 작업이 성공하면 `Book`의 객체가 반환됩니다.
4. 데이터를 검색하기 위해 get 메서드를 사용합니다.
앱을 실행하고 새로운 쿼리를 테스트하세요.
먼저, `List Publisher/Book` 버튼을 클릭하세요.
::Image[]{src="https://api.archbee.com/api/optimize/yD3zCY-NNBBIfd0uqcfR5/MtZZXEKd2vUJ7afLiv-wR_image.png" size="30" width="323" height="627" position="center" showCaption="false"}
목록에서 책을 선택하세요. 다음 화면에는 책과 그 관계에 대한 데이터가 표시됩니다.
::Image[]{src="https://api.archbee.com/api/optimize/yD3zCY-NNBBIfd0uqcfR5/IkAfHVHlwA-8sTmhK7cxh_image.png" size="30" width="328" height="637" position="center" showCaption="false"}
## 완료되었습니다!
이 시점에서, 당신은 다대다 관계를 생성하고 쿼리하는 방법과 Parse에서 관련 객체의 데이터를 반환하는 쿼리를 수행하는 방법을 배웠습니다.`Flutter`.