vue3 0生命週期詳解

vue3.0發布有一段時間了，最近學習了下生命週期

與 2.x 版本相對應的生命週期鉤子

vue3

beforecreate

setup()

created

setup()

mounted

onmounted

beforeupdate

onbeforeupdate

updated

onupdated

beforedestroy

onbeforeunmount

destroyed

onunmounted

第乙個引數是 props ,它在 setup 內部也是響應式的（注意不要對 props 直接使用解構賦值，這樣會破壞響應式，但是可以使用 torefs來實現安全的解構

第二個引數是 context ，它是乙個普通的物件（不是響應式的）並且暴露出3個元件屬性。1. arrts 2.emit 3.slots

可以使用

setup函式需要返回乙個物件，返回的所有東西附著在元件例項中

refref方法接受乙個原始值引數, 同時返回響應式的ref物件，原始值存在該物件的value屬性中

當乙個ref引數在渲染上下文中被訪問時，無需使用ref.value來進行訪問，會自動解套，如下圖

reactive方法接收乙個普通物件作為引數，然後返回該普通物件的響應式**，等同於2.0的vue.observable()已建立乙個響應式屬性

該方法傳入乙個函式，watcheffect方法可以監聽依賴，掛載時會立刻呼叫一次，如果依賴性更新時，會繼續呼叫

watch 方法

等同於2.0的watch方法，只不過寫法不同(具體的你們可以查閱下文件)

vue2 0生命週期詳解

內容beforecreate 建立前 在資料觀測和初始化事件還未開始 created 建立後 完成資料觀測，屬性和方法的運算，初始化事件，el屬性未見 beforemount 載入前 mounted 載入後 在el 被新建立的 vm.el 替換，並掛載到例項上去之後呼叫。例項已完成以下的配置 用上面...

vue2 0生命週期詳解

週期名稱 內容beforecreate 建立前 在資料觀測和初始化事件還未開始 created 建立後 完成資料觀測，屬性和方法的運算，初始化事件，el屬性未見 beforemount 載入前 mounted 載入後 在el 被新建立的 vm.el 替換，並掛載到例項上去之後呼叫。例項已完成以下的配...

vue05 生命週期

首先看下面 宣告週期就是vue例項在某乙個時間點會自動執行的函式，這些函式沒有放在methods裡面，直接在vue例項下。beforecreate vue例項初始化後執行 created 外部注入，雙向繫結等完成後執行 beforemount 頁面還沒有被渲染 mounted 頁面渲染完 befor...