effect方法主要用於處理函式的響應式，可用於計算屬性和watcheffect等功能，通過觸發函式中響應式變數的proxy的get方法實現將自身加入到proxy的deps中，實現與proxy關聯，也可以將其他依賴收集到自己的deps中
1. effect
建立乙個effect函式，如果不是lazy建立時會先呼叫一遍，這樣可以呼叫相關get並將effect加入相關proxy的deps中
function effect<
t= any>
( fn:()
=>t,
options: reactiveeffectoptions =
empty_obj
): reactiveeffect<
t>
const effect =
createreactiveeffect
(fn, options)if(
!options.lazy)
return effect
}
當呼叫effect時會建立乙個函式，該函式主要用於收集依賴和充當watcher。當生成的函式被呼叫時，先判斷active屬性，如果false則不會被收集依賴；接著將自身新增到effectstack中和將activeeffect改為自身，當呼叫fn時觸發fn中響應式變數的get，這時get會把effect新增到響應式變數的依賴中；最後從effectstack去除並重新賦值activeeffect。
function createreactiveeffect<
t= any>
( fn:
(...args: any)
=>t,
options: reactiveeffectoptions
): reactiveeffect<
t>if(
!effectstack.
includes
(effect)
)finally}}
as reactiveeffect
effect._iseffect =
true
effect.active =
true
effect.raw = fn
effect.deps =
// 這裡放置和effect相關的deps
effect.options = options
return effect
}
這裡主要用於收集依賴
function
track
(target: object, type: trackoptypes, key: unknown)
// 根據target將乙個map放入targetmap中
let depsmap = targetmap.
get(target)
if(depsmap ===
void0)
let dep = depsmap.
get(key)
if(dep ===
void0)
if(!dep.
has(activeeffect)))
}}}
Vue3 0系列（Vue3 0是如何變快的 ）
來說一說為什麼performance 效能比vue 2.x快1.2 2倍 這裡先提供兩個 2.1 diff演算法優化 例子 我是段落 也就是說，vue3在渲染的時候，給會改變的元素新增了靜態標記 import from vue export function render ctx,cache,pro...
快速上手vue3 0
安裝最新vue腳手架 npm i vue cli g 通過腳手架建立專案，並選擇3.0 vue create vue next 執行專案 npm run serve vue2.0採用的叫做選項式api 例如我們想實現某乙個功能，關於這個功能的資料我們會定義在data中，事件函式定義在methods中...
Vue3 0學習記錄
composition api 組合api 效能提公升 viteoptions api composition api 響應式系統公升級 vue.js 3.0中使用proxy物件重寫響應式系統 proxy物件效能本身就比 defineproperty好 物件可以攔截物件的賦值 刪除等，不需要初始化遍...