도리쓰에러쓰

[TIL] 프리온보딩 12일차 - 220514 본문

Project/원티드 프리온보딩 프론트엔드 코스

[TIL] 프리온보딩 12일차 - 220514

강도리 2022. 5. 15. 02:51

1️⃣ 검색하였을 때 영화 list에 즐겨찾기 아이콘 보이게 설정하기

- 우선 아래 코드로 local에 있는 데이터 가져오려고 하였는데 데이터가 없을 때는 에러가 났다.

그래서 null도 해보고 undefined도 해봤지만 에러가 해결되진 않았다.

const data = JSON.parse(localStorage.getItem('favorites')

 

- 아래와 같이 local 데이터를 불러왔더니 데이터가 없는 상태일 때도 에러가 나지 않았다.

(이 에러 고치느라 꽤나 오래 걸렸다...😂)

const data = JSON.parse(localStorage.getItem('favorites') || '[]')

 

- useState()가 아닌 변수로 즐겨찾기 아이콘을 보이게할지에 대한 설정을 하였다.

let showFavoriteIcon = false

data.forEach((favorite: Props['movie']) => {
    if(favorite.imdbID === movie.imdbID) {
      showFavoriteIcon = true
    }
 })

 

 

2️⃣ 중복된 ID값 제거

현재 영화 API에서 중복된 영화가 있었다. (ID값 등 모든 key와 value가 겹친다.)

그래서 중복된 영화가 있으면 lodash의 uniqBy를 통해 제거를 해줬다.

 

- lodash에서 uniqBy import하기

import { uniqBy } from 'lodash'

 

- uniqBy(객체, 'key값')를 통해 'key'의 value가 같으면 제거가 되도록 하였다.

const newArr = uniqBy(객체, 'key')
Comments