개인프로젝트 _ 8탄(React Navigation)

Seoyoung·2022년 3월 2일
0

개인프로젝트

목록 보기
8/9

어제 많은 부분에서 조그마한 수정사항이 생겼다 🕹

기획단계에서 꼼꼼하게 체크했다고 생각했던 부분들이, 실제 구현하면서 이건 이렇게 하는게 좋겠군! 움 이런 로직이 더 필요하겠군! 등등 조그마한 변화가 생겼고, 그 변화를 위해 전체적으로 리팩토링 작업이 필요했다!

하지만 오늘의 주제는!

React Navigation

왜냐하면 사용해보면서 정말 사용하기 좋게 잘 만들어졌다고 생각했고,
내가 원하는 기능들이 대부분 구비되어 있었다 🙌
참고로 나는 v6와 expo를 사용하여 개인프로젝트를 구현 중!

대부분의 자료는 공홈에 자세히 나와있으므로 -> https://reactnavigation.org/ (공홈 UI가 이쁨✨) 어제 구현할때 사용한 Passing parameters to routes 이부분을 담고싶다.

나는 같은 page이지만, 유저에 따라 유저의 정보가 담긴 page를 구현하고 싶었다.

Web에서는 url에 :userId를 부여해서 유저에 따라 다르게 보여졌는데, 이게 react native app환경에서는 어떻게 작동하는지 감이 잘 안오는 상태였다..

하지만! react-navigation에서는 route.params를 사용하면 된다 (더 간단해보이기두..)

1) previous screen 에서 new screen으로 이동할때 params 전달
이 부분은 Public page를 구현할 때 사용했다, 내 Public 상태만 보는 것이 아니라 친구들의 public도 보는 것이 이번 기능의 중요 뽀인트이므로, 유저가 갖고 있는 id를 이용해서 id별로 다른 데이터가 렌더링 되도록 했다.

2) Passing params to a previous screen
흥미로운 부분은 new screen에서 어떤 작업(CRUD)을 하고 prev screen으로 돌아갈 때, params를 전달할 수 있다! 이걸 잘 이용하면 지금 화면이동시 정보가 업데이트 되지 않는 문제를 해결할 수 있을 것 같다!

얼른 가서 해보고, 이 문제에 대해 다시 후기를 작성하러 오겠습니당! 🐿 🐿 🦔

profile
@ronachoiz

0개의 댓글