這篇文章主要介紹“Vue3.0 API中如何使用markRaw”的相關(guān)知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強(qiáng),希望這篇“Vue3.0 API中如何使用markRaw”文章能幫助大家解決問題。
10年積累的成都網(wǎng)站建設(shè)、網(wǎng)站建設(shè)經(jīng)驗,可以快速應(yīng)對客戶對網(wǎng)站的新想法和需求。提供各種問題對應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識你,你也不認(rèn)識我。但先網(wǎng)站設(shè)計后付款的網(wǎng)站建設(shè)流程,更有通山免費網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。
markRaw
標(biāo)記一個對象,使其永遠(yuǎn)不會轉(zhuǎn)換為 proxy。返回對象本身。
import { markRaw, reactive, isReactive } from "vue";
const foo = markRaw({})
console.log(isReactive(reactive(foo))) // false
// 嵌套在其他響應(yīng)式對象中時也可以使用
const bar = reactive({ foo })
console.log(isReactive(bar.foo)) // false
重要
markRaw 和下方的 shallowXXX API 使你可以有選擇地退出默認(rèn)的深度響應(yīng)式/只讀轉(zhuǎn)換模式,并將原始的,未被代理的對象嵌入狀態(tài)圖中。它們可以根據(jù)情況靈活運用:
有些值不應(yīng)該是響應(yīng)式的,例如復(fù)雜的第三方類實例或 Vue 組件對象。
當(dāng)渲染具有不可變數(shù)據(jù)源的大列表時,跳過 proxy 轉(zhuǎn)換可以提高性能。
這些例子是進(jìn)階的運用,因為原始選擇退出僅在根級別,因此,如果將嵌套在內(nèi)的、未標(biāo)記的原始對象添加進(jìn)響應(yīng)式對象,然后再次訪問該響應(yīng)式對象,就會得到原始對象被代理后的版本。這可能會導(dǎo)致同一性風(fēng)險——即執(zhí)行一個依賴于對象本身的操作,但同時使用同一對象的原始版本和被代理后的版本:
import { markRaw, reactive, isReactive } from "vue";
const foo = markRaw({
nested: {}
})
const bar = reactive({
// 雖然 `foo` 被標(biāo)記為原始,但 foo.nested 不是。
nested: foo.nested
})
console.log(foo.nested === bar.nested) // false
同一性風(fēng)險通常很少見。然而,為了正確地使用這些 API,同時安全地避免同一性風(fēng)險,就需要對響應(yīng)性系統(tǒng)的工作原理有一個充分的理解。
關(guān)于“Vue3.0 API中如何使用markRaw”的內(nèi)容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識,可以關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,小編每天都會為大家更新不同的知識點。