본문 바로가기

Front/React

MOBX Store 모델이 변경되었어도 렌더링이 안되는 이슈

정상적으로 코드를 작성한 경우에 렌더링이 안되는 경우 두가지 이유가 있었다.

 

나의 경우 테이블을 작성하고 검색하는 텍스트에 따라 결과를 뿌려주는 기능을 만들었다.

 

검색하여 Table의 Row의 결과값이 수정되었는데 변경이 되지 않았다.

 

간헐적으로 변경이 되지 않았는데 이유는 두가지였다.

 

1. @Observable DataModel 을 선언 할 때 하위 구조까지 명시해야한다.

mobx 5버전 이상은 알아서 하위 변경내용까지 감지해준다.

IE를 지원해야 하는 사이트의 경우 mobx 4버전을 사용해야하는데 이런 경우 내부까지 명시해주어야 한다.

 

ex) @Observable Members : { Student : { ID:"", NAME:""}}

 

2. 키값이 중복되지 않아야 한다.

ex) <TableRow key={userId}>

키값이 중복되는 경우 렌더링이 안되는 문제가 간헐적으로 일어날 수 있다.