六大亮點
性能更快
體積更小
組合API
更好支持ts
自定義渲染AIP
更先進(jìn)組建
性能：
-diff 算法優(yōu)化
只比較有靜態(tài)標(biāo)記的標(biāo)簽
-hoistStatic 靜態(tài)提升
不需要參與更新的元素纹磺，只渲染一次
-catchHandlers 事件偵聽緩存
onClick 不會被動態(tài)監(jiān)聽
組合API
解決數(shù)據(jù)與業(yè)務(wù)邏輯分散的問題
import {ref} from 'VUE' //只能監(jiān)聽簡單對象
import {reactive} from 'VUE'
setup(){
let state = reactive({
stus:[]
})
function remFun(){}
return {state,remFun}
}
Composition API 和 Option API 混合使用
CompositionAPI 本質(zhì)（組合API、注入API）
setup執(zhí)行時機(jī)：
beforeCreate : 組建剛被創(chuàng)建好谷徙，data 和method 還沒有初始化好
setup 無法使用data和methods, setup函數(shù)中的this是undefine, 不能是異步的
Created
什么是reactive？
實現(xiàn)響應(yīng)式數(shù)據(jù)的方法
import reactive from 'vue'
創(chuàng)建響應(yīng)式數(shù)據(jù)的時候需要傳入對象（JSON脚线、arr）日期等其他對像不能響應(yīng)在頁面嚷狞，要重新賦值绳姨。
ref
實現(xiàn)響應(yīng)式數(shù)據(jù)，監(jiān)聽簡單值她按。
本質(zhì)是reactive牛隅，ref(18)-> reactive({value:18})
通過ref創(chuàng)建的數(shù)據(jù)在template中使用不需要數(shù)據(jù).valule
非遞歸監(jiān)聽
shallowReactive\shallowRef (只有在監(jiān)聽的數(shù)據(jù)量比較大的時候用非遞歸監(jiān)聽)
triggerRef
shallowRef -> shallwoReactive
通過shallowRef 創(chuàng)建的值監(jiān)聽的是.vlaue的變化，
toRaw 從reactive,ref中的得到原始數(shù)據(jù)
數(shù)據(jù)默認(rèn)不是響應(yīng)式
let obj={name:'999',age:'88'}
let state = reactive(obj) //state的本質(zhì)是一個Proxy對象酌泰，引用了obj
// 如果直接修改obj 無法觸發(fā)頁面更新
let obj2= toRaw(state)
//當(dāng)一些操作不需要追蹤的時候媒佣，通過ToRaw方法拿到他的原始數(shù)據(jù)，對原始數(shù)據(jù)進(jìn)行修改陵刹，提示性能默伍。
// 如果想通過toRow拿到ref類型的原始數(shù)據(jù)，要告訴toRaw方法獲取的是.value的值授霸，
markRaw
讓數(shù)據(jù)無法被追蹤
toRef
如果利用ref將對象某一對象的某一屬性變成響應(yīng)式數(shù)據(jù)巡验，，我們修改響應(yīng)式的數(shù)據(jù)是不會影響到原始數(shù)據(jù)碘耳。
如果利用toRef 將對象的屬性變成響應(yīng)式數(shù)據(jù)显设，我們修改響應(yīng)式數(shù)據(jù)會影響到原始數(shù)據(jù)，但是UI界面不變化辛辨。
ref :復(fù)制捕捂，不會影響以前數(shù)據(jù)，界面會自動更新
toRef:引用斗搞，修改響應(yīng)數(shù)據(jù)會影響以前數(shù)據(jù)指攒，界面不會自動更新；應(yīng)用場景：響應(yīng)式數(shù)據(jù)與以前數(shù)據(jù)關(guān)聯(lián)起來僻焚，并且更新響應(yīng)式數(shù)據(jù)不影響UI時使用允悦。
toRefs
接收的參數(shù)是個對象
customRef
獲取元素
在組合API中用生命周期，獲取頁面中元素
<div ref='box'>
import{ref, onMounted} from 'vue'
setup(){let box = ref(null);
onMounted(()=>{
console.log(box.value)
})
return{box}
}
readonly
創(chuàng)建只讀數(shù)據(jù)虑啤，遞歸只讀隙弛，不能給屬性重新賦值。
shallowReadolny ,非遞歸只讀
isReadonly
const 創(chuàng)建只讀數(shù)據(jù)狞山，賦值保護(hù)全闷，不能給變量重新賦值
VUE3 響應(yīng)式數(shù)據(jù)本質(zhì)
創(chuàng)建V3
Webpack
Vue-CLI
Vite 項目管理打包工具
