반응형
Notice
Recent Posts
Recent Comments
Link
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | ||||||
| 2 | 3 | 4 | 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 16 | 17 | 18 | 19 | 20 | 21 | 22 |
| 23 | 24 | 25 | 26 | 27 | 28 | 29 |
| 30 |
Tags
- Apollo Client
- task-definition
- redux saga
- 환경 레코드
- 비동기 처리
- Spa
- 변수 섀도잉
- restore scroll position
- Next.js
- NextJS
- Architecture
- 타입스크립트
- 마이크로 프론트엔드
- useRef
- scrollTo 안됨
- graphql
- CSR
- nvm
- Typescript
- SAGA 패턴
- Babel
- Webpack
- SSR
- ESLint
- 무한 스크롤
- 세션스토리지
- Apollo Server
- 실행 컨텍스트
- 스코프체이닝
- 식별자 결정
Archives
- Today
- Total
목록NextJS (1)
minguri brain is busy
무한 스크롤 리스트에는 뒤로가기를 갔다가 보던 위치를 기억해주는 기능은 UX적으로 필수적이다. 다른 페이지에 갔다가 뒤로가기로 페이지에 돌아올 경우, 더보기로 새로 로드된 데이터는 초기화되고 없으므로 실제로 보던 위치로 돌아가지 못하는 문제가 있다. sessionStorage를 사용해서 해결한 방법을 적고자한다. 우선 리스트에서 상품을 클릭할때 sessionStorage에 현재 스크롤 위치와 로드한 데이터를 저장한다. // ProductItem.tsx const handleProductClick = async () => { await setScrollDataInStorage(); handleChangeLocation(`${publicRuntimeConfig.config.productHost}/produc..
FE/개발
2022. 12. 23. 17:51