[React Native] 데이터 가공 (데이터 키값의 이름 및 구조 변경)

 

<Select> 태그는 data props를 받아온다.

아래의 사진과 같이 받아온 data인 '로그인, 기타'가 선택지로 나타난다.

이 선택지이 보이려면 data의 key값 이름이 id와 text로 된 객체배열을 읽는다.

 

---

 

[ 데이터 가공전 데이타_ categoryData ]

하지만 이번에 받은 'categoryData'데이터는 label, value로만 구성된 객체배열이다.

[
   {
	   "label":"로그인",
	   "value":"로그인"
   },
   {
	   "label":"기타",
	   "value":"기타"
   }
]

---

[ 데이터 가공후 데이타_ processedCD ]

아래와 같이 select가 읽을수 있는 데이터로 가공하였다.

[
   {
	   "id":0,
	   "text":"로그인"
   },
   {
	   "id":1,
	   "text":"기타"
   }
]

---

[ 데이터 가공 방법 ]

id라는 키값을 만들고, index 번호를 부여하였다.

text라는 키값을 만들고, label 키값에 있던 value값을 부여하였다.

  const processedCD = categoryData?.MFB_CATEGORY_LIST?.map(
    (item, idx) => ({ id: idx, text: item.label }),
  );