幫人代做靜態(tài)網(wǎng)站多少錢剛出來的新產(chǎn)品怎么推
1、pinia和vuex的區(qū)別
????????1.pinia沒有mutations,只有state,getters,actions
????????2.pinia分模塊不需要modules (之前vuex分模塊需要modules)
????????3.pinia體積更小(性能更好)
????????4.pinia可以直接修改state數(shù)據(jù)
2、Vue2和vue3的響應(yīng)式原理分別是什么,以及vue3為什么要更改實(shí)現(xiàn)響應(yīng)式原理的方式
Vue2中使用的響應(yīng)式原理是通過Object.defineProperty方法對數(shù)據(jù)進(jìn)行劫持監(jiān)聽,從而實(shí)現(xiàn)數(shù)據(jù)的響應(yīng)式更新。
而Vue3中使用的響應(yīng)式原理是基于ES6的Proxy實(shí)現(xiàn)的,通過Proxy對象代理數(shù)據(jù),可以實(shí)現(xiàn)更高效的數(shù)據(jù)監(jiān)聽和更新,同時(shí)也可以監(jiān)聽到數(shù)組的變化。
3. 選項(xiàng)式API與組合式api的區(qū)別
在邏輯組織和邏輯復(fù)用方面,Composition API是優(yōu)于Options API
因?yàn)镃omposition API幾乎是函數(shù),會有更好的類型推斷。
Composition API對 tree-shaking 友好,代碼也更容易壓縮
Composition API中見不到this的使用,減少了this指向不明的情況
如果是小型組件,可以繼續(xù)使用Options API,也是十分友好的
4- ref與reactive的區(qū)別
定義數(shù)據(jù)角度:
????????ref用來定義:基本類型數(shù)據(jù)。
????????reactive用來定義:對象(或數(shù)組)類型數(shù)據(jù)。
????????備注:ref也可以用來定義對象(或數(shù)組)類型數(shù)據(jù), 它內(nèi)部會自動(dòng)通過reactive轉(zhuǎn)為代理對象。
原理角度:
????????ref通過Object.defineProperty()的get與set來實(shí)現(xiàn)響應(yīng)式(數(shù)據(jù)劫持)。
????????reactive通過使用Proxy來實(shí)現(xiàn)響應(yīng)式(數(shù)據(jù)劫持), 并通過Reflect操作源對象內(nèi)部的數(shù)據(jù)。
使用角度:
????????ref定義的數(shù)據(jù):操作數(shù)據(jù)需要.value,讀取數(shù)據(jù)時(shí)模板中直接讀取不需要.value。
????????reactive定義的數(shù)據(jù):操作數(shù)據(jù)與讀取數(shù)據(jù):均不需要.value。
5、 setup的作用
setup是什么,作用
????????1、新的選項(xiàng),所有的組合api函數(shù)都在此使用,只在初始化時(shí)執(zhí)行一次
????????2、函數(shù)如果返回對象,對象中的屬性與方法,在模板中可以直接使用
執(zhí)行時(shí)機(jī):
????????1、在beforeCreate之前執(zhí)行一次,此時(shí)組件對象還沒有創(chuàng)建
????????2、This的值為undefined,不能通過this操作 data、computed、methods、props
????????3、所有的composition api 都不能使用this
返回值:
????????1、一般都返回一個(gè)對象,用于向模板返回?cái)?shù)據(jù),返回的數(shù)據(jù)模板可以直接使用
????????2、返回的對象的屬性與data返回的數(shù)據(jù) 在組件對象中屬性合并
????????3、返回的對象的方法與methods返回的數(shù)據(jù) 在組件對象中方法合并
????????4、切記:
????????????????(1)如遇相同名字 setup優(yōu)先
????????????????(2)Methods可以訪問setup中屬性與方法,setup不可以訪問data與methods ,此方式不推薦使用
????????????????(3)Setup不能是一個(gè)異步函數(shù),如果設(shè)置為異步函數(shù)返回的是一個(gè)promise,模板不能獲取到return返回的對象
? ? ? ? ? ? ? 參數(shù):
????????????????????????setup(props, context) / setup(props, {attrs, slots, emit})
????????????????????????props:接收組件的屬性,
????????????????????????context:上下文對象,包括 slots,attrs,emit,expose
????????????????????????(1)attrs: 包含沒有在props配置中聲明的屬性的對象, 相當(dāng)于 this.a t t r s ( 2 ) s l o t s : 包含所有傳入的插槽內(nèi)容的對象 , 相當(dāng)于 t h i s . attrs
????????????????????????(2)slots: 包含所有傳入的插槽內(nèi)容的對象, 相當(dāng)于 this.attrs(2)slots:包含所有傳入的插槽內(nèi)容的對象,相當(dāng)于this.slots
????????????????????????(3)emit: 用來分發(fā)自定義事件的函數(shù), 相當(dāng)于 this.$emit