화면 렌더링에 관련한 문제인데 어디서 문제가 발생했는지 궁금합니다

Question

기존에 강의를 따라하면서 발생하지 않았던 문제인데 언젠가부터 갑자기 발생한 문제여서 ㅠㅠ 혹시 이런 경우가 있는지 궁금합니다. 1.  이 부분이 첫 화면이라고 했을때 #베라라고 되어있는 해시태그를 클릭하면 reducer에서는 잘 불러오는데 화면은 렌더링되지 않습니다 이 상태에서 새로고침을 하면 이런식으로 해당 해시태그에 맞게 렌더링이 됩니다. 여기서 메인페이지로 가는 버튼을 누르게되면 마찬가지로 reducer에서는 잘 불러오고 있는데, 화면에는 렌더링되지 않고 있습니다. 뭔가 데이터를 불러오는 것에는 문제가 없는데, 렌더가 되면서 오류가 생기는 것 같은데 이런 문제가 생길 수 있는지 궁금합니다 ㅠㅠ 따로 오류 메세지 생기는 부분은 이렇게 중복되면서 key값이 중복되는 메세지만 발생하는데 이 부분은 아마 중복되서 생기는 것 같습니다. 기존에 강의를 따라할 때는 문제가 생기지 않았던 부분인데 코드를 계속 비교해봐도 도저히 알 수가 없어서 질문 드립니다 ㅠㅠ  댓글을 추가한다던가 하는 한 화면에서 진행되는 문제에서는 같은 현상이 발생하지 않는데 주소를 넘어갈때 문제가 발생합니다 ㅠㅠ

jinne · Answer

그 부분이 맞는 것 같습니다! 제가 이 부분을 immer로 바꾸지 않아서 놓친 부분이었던 것 같습니다 ㅠㅠ 감사합니다!

제로초(조현영) · Answer

https://github.com/ZeroCho/react-nodebird/blob/master/ch8/front/reducers/post.js#L129

제로초(조현영) · Answer

LOAD_POST_REQUEST에서 lastId가 없으면 mainPosts를 비우는 작업(lastId가 없으면 초기 페이지 로딩)을 하지 않으셨나요?

jinne · Answer

저게 중간에 예를 들면 메인에 있다가 해시태그를 누르는 과정에서 메인에 58이라는 key가 이미 있는데 hashtag를 누르면서 hashtag 주소에서 포스트를 또 불러와서 중복이 되는 것 같습니다 (이 부분은 reducer로 확인이 가능합니다). 키는 전부 id로 지정해서 겹칠수가 없습니다 ㅠㅠ (저 key가 post의 id값이 맞습니다)

제로초(조현영) · Answer

일단은 key가 문제인 것 같습니다. 58이 겹치지않는데 겹친다고 하니 여기서 문제인것같습니다. 이게 렌더링을 막는 것 같습니다.