Javascript & HTML & CSS/reactjs
React + Typescript Scroll Down 구현
전봉근
2020. 3. 21. 15:35
반응형
Scroll Down 구현
// Render DOM
// ref가 지정된 곳으로 포커싱이 될 예정이다.
forEach({
....
<input
...
ref={this.refElement}
...
/>
})
// 스크롤 다운 함수
async handleScrollDown() {
if (this.scrollLocationRef && this.scrollLocationRef.current) {
this.scrollLocationRef.current.scrollIntoView({
behavior: 'smooth',
block: 'start'
})
}
}
// 실행되는 함수
// 동적 추가할 때 마다 새로 생성된 행의 Ref를 찾을 수 없어서 우선 재귀함수로 해결.. (__)
this.handleScrollDown().then(() => {
this.handleScrollDown().then(() => {})
})
반응형