前言

寫代碼的過程中一定會遇到報(bào)錯(cuò)，遇到報(bào)錯(cuò)不要擔(dān)心，認(rèn)真分析就可以解決報(bào)錯(cuò)，同時(shí)積累經(jīng)驗(yàn)，早日成為大牛?? 本文會整理一些在編碼過程中遇到的常見報(bào)錯(cuò)，共同學(xué)習(xí)。

一、報(bào)錯(cuò)結(jié)構(gòu)

報(bào)錯(cuò)信息一般會包含這幾部分：錯(cuò)誤類型、錯(cuò)誤位置、錯(cuò)誤描述、錯(cuò)誤規(guī)則和問題數(shù)量。

如上圖：

報(bào)錯(cuò)類型為編譯錯(cuò)誤；

錯(cuò)誤位置在D:\myel\src\views\admin\AdminView.vue中的第四行第2個(gè)字符；（報(bào)錯(cuò)位置不一定每次都是準(zhǔn)確的，但是可以根據(jù)提示縮小范圍）

錯(cuò)誤描述 當(dāng)前錯(cuò)誤Mixed spaces and tabs指space空格和tab空格混合了（可根據(jù)翻譯來判斷錯(cuò)誤）；

錯(cuò)誤規(guī)則 no-mixed-spaces-and-tabs指space空格和tab空格不能混合使用；

錯(cuò)誤數(shù)量 統(tǒng)計(jì)當(dāng)前有幾個(gè)報(bào)錯(cuò) error需要解決，warning根據(jù)實(shí)際情況看需不需要立即解決。

二、常見問題總結(jié)及解決方法

Mixed spaces and tabs

空格混合使用了

解決方法：1、在當(dāng)前頁面格式化代碼 2、在.eslintrc.js文件的rules中添加"no-mixed-spaces-and-tabs": "off"

Unexpected keyword 'const'

沒有預(yù)料到的關(guān)鍵字const

仔細(xì)看這幾行代碼就可以發(fā)現(xiàn)， 53行結(jié)尾的應(yīng)為分號寫成了逗號

解決辦法：將53行逗號改為分號

Module not found: Error: Can't resolve '....' in '....'

模塊找不到：不能resolve（兌現(xiàn)，發(fā)現(xiàn)，解決）../views/admin/DashVeiw.vue

在D:\myel\src\router

 這種情況一般是路由中配置的文件路徑寫錯(cuò)了

解決辦法：將路徑改為正確路徑（小技巧：使用自動提示的路徑或者復(fù)制文件名，避免手誤打錯(cuò)）

 Element is missing end tag

元素缺少一個(gè)結(jié)束標(biāo)簽

是當(dāng)前文件的<div class="login">缺少后半個(gè)</div>

 解決方法：分析好html的結(jié)構(gòu)，將缺少的結(jié)束標(biāo)簽添加上

TypeError: Cannot read properties of undefined (reading '...') 

不能讀取undefined的屬性

 原因是掛載時(shí)有dom節(jié)點(diǎn)但是數(shù)據(jù)還沒獲取，當(dāng)時(shí)那個(gè)數(shù)據(jù)可能為空

解決方法：在當(dāng)前標(biāo)簽（同時(shí)用了v-for的話就上一級標(biāo)簽）加上v-if判斷該數(shù)據(jù)是否存在

用[]或.指定數(shù)據(jù)時(shí)都可能會出現(xiàn)這個(gè)錯(cuò)誤，要記得使用v-if

TypeError: ...forEach is not a function

...沒有forEach方法

當(dāng)前數(shù)據(jù)不是個(gè)數(shù)組

 解決方法：分析數(shù)據(jù)的結(jié)構(gòu)，找到真正需要遍歷的對象

'...' is not defined / no-undef

...沒有定義

 解決辦法：找到報(bào)錯(cuò)位置，按照提示導(dǎo)入相應(yīng)關(guān)鍵字

總結(jié)

到此這篇關(guān)于Vue常見報(bào)錯(cuò)以及解決的文章就介紹到這了,更多相關(guān)Vue常見報(bào)錯(cuò)解決內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論