> 웹 프론트엔드 > JS 튜토리얼 > Firestore의 중첩 배열 필드에서 단일 항목을 업데이트하는 방법은 무엇입니까?

Firestore의 중첩 배열 필드에서 단일 항목을 업데이트하는 방법은 무엇입니까?

Barbara Streisand
풀어 주다: 2024-11-26 03:03:13
원래의
597명이 탐색했습니다.

How to Update a Single Item in a Nested Array Field in Firestore?

Firestore 내 배열 필드의 단일 항목을 업데이트하는 방법

Firestore에서 배열은 문서 내에 중첩될 수 있습니다. 그러나 Firestore의 배열 필드는 다른 프로그래밍 언어의 배열과 다르게 동작한다는 점을 이해하는 것이 중요합니다.

문제 설명:
Firestore 문서의 배열 필드 내의 특정 요소 업데이트 어려울 수 있습니다. items[0].meta.description과 같은 배열 내의 중첩 필드를 직접 업데이트하려고 시도하면 예상치 못한 결과가 발생할 수 있습니다.

초기 접근 방식:
처음에는 다음을 시도했습니다. 다음 코드를 사용하여 중첩된 필드를 업데이트합니다.

const key = `items.${this.state.index}.meta.description`;
const property = `hello bar`;

this.design.update({
    [key]: property
})
로그인 후 복사

그러나 이 접근 방식은 개체를 지정된 인덱스에 저장합니다.

대체 접근 방식:
다음 시도에서 전체 메타 개체를 다시 작성했습니다.

const key = `items.${this.state.index}.meta`;
const property = e.target.value;
let meta = this.state.meta;
meta[e.target.id] = property;

this.design.update({
    [key]: meta
})
로그인 후 복사

이 접근 방식은 성공적으로 업데이트되었습니다. 중첩된 필드를 사용하여 배열을 다음으로 변환했습니다. object.

해결책:
Firestore는 배열 내의 특정 항목을 업데이트하는 직접적인 방법을 제공하지 않습니다. 대신 문서에서 전체 배열을 읽고 메모리에서 수정한 다음 전체 배열 필드를 업데이트해야 합니다.

이 작업은 다음 단계를 사용하여 수행할 수 있습니다.

  1. get() 메서드를 사용하여 문서에서 전체 배열을 읽습니다.
  2. map() 또는 find()와 같은 메서드를 사용하여 문서 내의 특정 요소를 찾고 수정합니다.
  3. 수정된 배열로 set() 또는 update() 메소드를 사용하여 배열 필드를 업데이트합니다.

다음은 예제 코드입니다.

const docRef = firestore.doc(`document/${id}`);

let items;
// Read the document and retrieve the items array
await docRef.get().then((doc) => {
  if (doc.exists) {
    items = doc.data().items;
  }
});

// Update the specific element in the array
const updatedItem = items.find((item) => item.name === 'Bar');
updatedItem.meta.description = 'hello bar';

// Update the entire array field with the modified array
await docRef.update({ items });
로그인 후 복사

위 내용은 Firestore의 중첩 배열 필드에서 단일 항목을 업데이트하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿