Vue3報錯：Property “xxx” was accessed during render but is not defined on instance.

翻譯：屬性“xxx”在呈現(xiàn)期間被訪問，但沒有在實例上定義。

其實就是在模板上有，但是在script上沒有定義

很多同學(xué)跟說這不是報錯，是警告，其實只要是在渲染頁面時出現(xiàn)的問題，我們都可以說成是報錯

因為如果有警告，到項目發(fā)布的時候是會出現(xiàn)問題的

所以不管是報錯還是警告，出現(xiàn)了就必須先解決掉

跟著這個報錯的還有下面兩個報錯：
Unhandled error during execution of render function

意思是在執(zhí)行渲染函數(shù)時未處理的錯誤

Unhandled error during execution of scheduler flush. This is likely a Vue internals bug.
這個就牛了，警告說可能是vue內(nèi)部的bug，執(zhí)行調(diào)度器刷新期間未處理的錯誤。

這三個報錯都是一起出現(xiàn)的，所以找問題還是挺好找的，解決bug的提供一下思路

出現(xiàn)bug的背景是我在某一個文件中寫了太多的代碼，所以想把其中一部分封裝成組件再引用進來，然后就新建了一個帶有初始模板的頁面，再把原頁面中的部分代碼函數(shù)樣式復(fù)制過去

初始模板如下：

<template>
</template>

<script>
</script>

<style>
</style>

通過第一個報錯，模板上有，但是沒有定義，我們可以去script找，發(fā)現(xiàn)script里寫了沒有問題，然后第二三個報錯并不能給我什么有利的信息，然后我就發(fā)現(xiàn)script中沒有加上組合式 API即setup，加上了就沒報錯了

所以問題的出現(xiàn)原因是在新創(chuàng)建的vue模板文件中沒有加上語法糖

解決問題就是<script setup>

通過此次報錯，需要記一下在新建vue文件封裝組件的時候檢查標(biāo)簽有沒有少寫

總結(jié)

到此這篇關(guān)于解決Vue3報錯:Property “xxx“ was accessed during render but is not defined on instance的文章就介紹到這了,更多相關(guān)Vue3報錯Property “xxx“內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論