vue3의 라이프사이클은 무엇인가요?

Vue3 수명 주기: 1. beforeCreate; 4. 마운트; 7. beforeDestroy; 10. 비활성화; 12. getDerivedStateFromProps 등.

Vue 3에는 새로운 라이프 사이클 후크 기능이 도입되었으며 일부 기존 후크 기능이 리팩토링되거나 삭제되었습니다. 다음은 Vue 3의 일부 라이프 사이클 후크 기능입니다:

1.beforeCreate: 인스턴스가 생성되기 전에 호출되며 현재는 마운트되지 않았으며 데이터 관찰자와 이벤트가 아직 초기화되지 않았습니다.

2.생성됨: 인스턴스 생성 후 호출됩니다. 이때 데이터 관찰(데이터 관찰자) 및 이벤트 초기화가 완료되었지만 아직 DOM이 마운트되지 않았습니다.

3.beforeMount: 마운트하기 전에 호출되며, 관련 렌더 함수가 처음 호출됩니다. 이 시점에서 템플릿을 컴파일하고 렌더링할 수 있습니다.

4. 마운트됨: 인스턴스가 DOM에 마운트된 후 호출됩니다. 이때 모든 el과 ref가 파싱되었으며 $refs가 채워졌습니다.

5. beforeUpdate: 가상 DOM이 패치되기 전에 데이터가 업데이트될 때 호출됩니다. 이 시점에서 상태를 업데이트하거나 DOM을 수동으로 변경할 수 있습니다.

6. 업데이트됨: 가상 DOM이 패치되고 DOM이 업데이트된 후 발생하는 데이터 업데이트가 완료된 후 호출됩니다.

7. beforeDestroy: 인스턴스가 파괴되기 전에 호출됩니다. 이 단계에서도 인스턴스는 여전히 완전히 사용 가능합니다.

8. 파괴됨: 인스턴스가 파괴된 후 호출됩니다. 호출 후에는 모든 이벤트 리스너와 하위 구성 요소가 제거되고 모든 하위 구성 요소 삭제 후크도 호출됩니다.

9. 활성화됨: 활성화된 연결 유지 구성 요소가 다시 들어갈 때 호출됩니다.

10. 비활성화됨: 활성화된 연결 유지 구성 요소가 떠날 때 호출됩니다.

11.errorCaptured: 캡처 단계에서 오류를 처리할 때 호출됩니다. 이 후크가 값을 반환하지 않거나 false를 반환하면 상위 구성 요소의 errorCaptured 후크가 계속 호출됩니다. 그렇지 않으면 오류가 더 이상 처리되지 않습니다.

12.getDerivedStateFromProps: 각 렌더링 전에 호출되며 props에서 상태를 파생하는 데 사용됩니다. 이는 구성 요소가 생성되기 전이나 구성 요소가 삭제된 후에 변경될 수 있는 정적 메서드입니다.

13. renderTracked 및 renderTriggered: 이 두 후크는 렌더링 프로세스 중에 트리거되고, 후자는 렌더링이 강제로 트리거될 때 트리거됩니다.

14. 설정: Vue 3에서는 구성 요소 옵션 API가 Composition API로 대체되었습니다. 설정 함수는 Composition API의 진입점이며 구성 요소 논리를 구성하고 재사용하는 데 사용됩니다. 이는 구성요소 옵션을 정의하는 새롭고 더욱 강력하며 유연한 방법입니다.

위는 Vue 3의 Life Cycle Hook 기능입니다. Vue 3는 기본 레이어에 많은 최적화를 수행했기 때문에 일부 오래된 후크 기능(예: init, Ready 등)이 제거되거나 다른 후크 기능에 병합되었습니다. 동시에 Vue 3에는 활성화, 비활성화, errorCaptured 등과 같은 성능 및 오류 처리 최적화를 위한 몇 가지 새로운 후크 기능도 추가되었습니다.

위 내용은 vue3의 라이프사이클은 무엇인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!