codestates / codestates/BanThing

[Error Handling] 새로고침시 스크롤 위치 유지 현상 수정

Open
#101 0 comments 0 reactions 1 assignee Claimed by @slight-snow View on GitHub
client error solved
Dominant language
TypeScript
Stars
0
Forks
2
PR merge metrics
No merged PRs in 30d

Description

### 어떤 에러인가요?
- Landing Page 는 스크롤을 내림에 따라 아래쪽의 컴포넌트들이 순차적으로 나오며 사용자에게 기능을 소개하는 페이지입니다.
Landing Page 에서 스크롤을 제일 아래로 내린 다음, 새로고침을 하면 최상단의 메인 화면이 다시 나와야합니다.
- 그러나 새로고침을 한 후에도 해당 위치에 고정되는 현상을 발견했습니다.
이는 맨아래에서 새로고침시 화면이 그대로 맨아래에 있으며 순차적으로 위로 다시 올라가야하는 불쾌한 UX를 야기할 수 있습니다.

### 에러 핸들링 방법
- window.onload 메소드를 통해 새로고침 됐을 경우의 함수를 작성했습니다.
```javascript
window.onload = function () {
setTimeout(function () {
scrollTo(0, 0);
}, 100);
};
```
- 하지만 이전에 Scroll Indicator 를 다룰 때와 마찬가지로 window 가 'undefined' 인 경우를 제외시켜줍니다.
```javascript
if (typeof window !== 'undefined') {
window.onload = function () {
setTimeout(function () {
scrollTo(0, 0);
}, 100);
};
}
```
- 위와 같이 작성하면 에러 없이 무사히 정상적으로 작동합니다.
새로고침시 스크롤 위치가 최상단으로 초기화되는 것을 확인했습니다 :3


Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.