componentDidUpdate(prevProps, prevState, snapshot) {
// codes..
}
Updating
단계에서 실행되는 메서드snapshot
은 getSnapshotBeforeUpdate()
메서드에서 반환된 값을 사용한다.getSnapshotBeforeUpdate()
메서드가 반환하는 값이 없다면 snapshot
은 undefined
.getSnapshotBeforeUpdate()
메서드와 연관되어 작동할 수 있다는 것도 기억하자.getSnapshotBeforeUpdate() {
// codes..
}
getSnapshotBeforeUpdate()
라이프사이클 메서드는 return
문을 통하여 snapshot
을 생성한다.
그리고 생성된 snapshot
은 componentDidUpdate()
의 3번째
인자로 전달된다.
예를 들어,
getSnapshotBeforeUpdate() {
return 100;
}
componentDidUpdate(prevProps, prevState, snapshot) {
console.log(snapshot);
}
getSnapshotBeforeUpdate()
에서 100
이 리턴되었으므로 100
이 snapshot
되었고
console
에 snapshot
의 값으로 100
이 찍히게 된다.
조사해본 바로는 사용할 수 있는 예시로 리렌더링을 통해 DOM이 업데이트되기 전에 특정 태그의 position
을 snapshot
찍은 후에 업데이트되었을 때 componentDidUpdate()
를 통해 업데이트 이후 바뀐 태그의 position
정보를 가져다 쓰는데 쓸 수 있다고 한다.