Vue 구성 요소의 각 수명 주기에 대한 책임에 대한 개요입니다!

Vue 컴포넌트의 라이프사이클, 각 라이프사이클은 무엇을 하며, 이 라이프사이클에서는 무엇을 해야 할까요?

[관련 추천: vue.js 비디오 튜토리얼]

각 생명주기가 언제 호출되는지 알기

• 1.beforeCreate는 인스턴스가 초기화된 후, 데이터 관찰자 전에 호출됩니다.

• 2.created는 인스턴스가 생성된 후 호출됩니다. 이 단계에서 인스턴스는 데이터 관찰자, 속성 및 메서드에 대한 작업, 감시/이벤트 이벤트 콜백 구성을 완료했습니다. 여기에는 $el이 없습니다

• 3.beforeMount는 마운트가 시작되기 전에 호출됩니다. 관련 렌더 함수가 처음으로 호출됩니다.

• 4.mounted el은 새로 생성된 vm.$el로 대체되고 이 후크를 호출하기 전에 인스턴스에 마운트됩니다.

• 5.beforeUpdate는 데이터가 업데이트될 때 호출되며, 이는 가상 DOM이 다시 렌더링되고 패치되기 전에 발생합니다.

• 6.updated 이 후크는 데이터 변경으로 인해 가상 DOM을 다시 렌더링하고 패치한 후에 호출됩니다.

• 7.beforeDestroy는 인스턴스가 삭제되기 전에 호출됩니다. 이 단계에서는 인스턴스를 여전히 완전히 사용할 수 있습니다.

• 8.destroyed Vue 인스턴스가 삭제된 후 호출됩니다. 이 호출 후에는 Vue 인스턴스가 가리키는 모든 것이 바인딩 해제되고 모든 이벤트 리스너가 제거되며 모든 하위 인스턴스가 삭제됩니다. 이 후크는 서버 측 렌더링 중에 호출되지 않습니다

각 라이프 사이클 내에서 수행할 수 있는 작업을 이해하기 위해

• 1.created 인스턴스가 생성되었습니다. 일부 데이터를 수행하는 가장 빠른 트리거 이유이기 때문입니다. , 리소스 요청.

• 2.mounted 인스턴스가 마운트되었으며 일부 DOM 작업을 수행할 수 있습니다.

• 3.beforeUpdate 이 후크에서 상태를 추가로 변경할 수 있으며 이는 추가 재렌더링 프로세스를 트리거하지 않습니다.

• 4.updated는 DOM에 의존하는 작업을 수행할 수 있습니다. 그러나 대부분의 경우 이 기간 동안 상태를 변경하지 않아야 합니다. 이로 인해 무한 업데이트 루프가 발생할 수 있습니다. 이 후크는 서버측 렌더링 중에는 호출되지 않습니다.

• 5.destroyed는 일부 최적화 작업, 타이머 지우기 및 이벤트 바인딩 해제를 수행할 수 있습니다

위 내용은 Vue 구성 요소의 각 수명 주기에 대한 책임에 대한 개요입니다!의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!