Vue router/Element重復(fù)點擊導(dǎo)航路由報錯問題及解決
更新時間：2022年07月31日 11:20:46 作者：新恒
這篇文章主要介紹了Vue router/Element重復(fù)點擊導(dǎo)航路由報錯問題及解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
Vue router/Element重復(fù)點擊導(dǎo)航路由報錯
雖然此報錯并不會影響項目運行，但是作為一個強迫癥的碼農(nóng)的確受不了error
解決方法如下
方法1：在項目目錄下運行 npm i vue-router@3.0 -S 將vue-router改為3.0版本即可；
方法2：若不想更換版本解決方法
在router.js中加入以下代碼就可以
記住插入的位置
const originalPush = Router.prototype.push
Router.prototype.push = function push(location) {
return originalPush.call(this, location).catch(err => err)
}
// 如果你的改了push還是沒有生效，可以考慮改replace方法
// 修改路由replace方法,阻止重復(fù)點擊報錯
const originalReplace = VueRouter.prototype.replace;
VueRouter.prototype.replace = function replace(location) {
return originalReplace.call(this, location).catch(err => err);
};Vue使用element-UI路由報錯問題
Invalid prop: type check failed for prop "router". Expected Boolean, got String.
prop校驗路由時，要求router是一個boolean類型，但是得到的是一個string類型
官網(wǎng)上router參數(shù)是boolean類型
官網(wǎng)地址： Element - The world's most popular Vue UI framework
報錯代碼
<el-menu
router="true"
default-active="2"
class="el-menu-vertical-demo"
text-color="#5F5F60"
:collapse="isCollapse"
>
<el-menu-item index="/library/slider">
<i class="el-icon-menu"></i>
<span slot="title">首頁</span>
</el-menu-item>
</el-menu>修改方案
1、直接寫router 不要后面的true
<el-menu
router
default-active="2"
class="el-menu-vertical-demo"
text-color="#5F5F60"
:collapse="isCollapse"
>
<el-menu-item index="/library/slider">
<i class="el-icon-menu"></i>
<span slot="title">首頁</span>
</el-menu-item>
</el-menu>2、通過數(shù)據(jù)綁定
<el-menu
:router="router"
default-active="2"
class="el-menu-vertical-demo"
text-color="#5F5F60"
:collapse="isCollapse"
>
<el-menu-item index="/library/slider">
<i class="el-icon-menu"></i>
<span slot="title">首頁</span>
</el-menu-item>
</el-menu>data(){
return {
router:true
}
}以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
關(guān)于vue中watch檢測到不到對象屬性的變化的解決方法
本篇文章主要介紹了關(guān)于vue中watch檢測到不到對象屬性的變化的解決方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-02-02
vue常用的數(shù)字孿生可視化的自適應(yīng)方案
這篇文章主要為大家介紹了vue常用的數(shù)字孿生可視化的自適應(yīng)方案詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-07-07
這篇文章主要介紹了vue如何循環(huán)請求一個接口問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-07-07
Vue3如何利用xlsx、xlsx-js-style導(dǎo)出Excel表格使用(適合新手)
在Vue項目中導(dǎo)出Excel表格是常見的功能,特別是在后臺管理系統(tǒng)中,為了方便用戶將大量數(shù)據(jù)保存為本地文件,這篇文章主要給大家介紹了關(guān)于Vue3如何利用xlsx、xlsx-js-style導(dǎo)出Excel表格使用的相關(guān)資料,需要的朋友可以參考下2024-06-06
這篇文章主要為大家詳細介紹了vue3中websocket的封裝與使用的相關(guān)知識,文中的示例代碼講解詳細,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-12-12
這篇文章主要介紹了vue中v-bind和v-model的區(qū)別及說明,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
這篇文章主要介紹了解決Vue+ts里面this.$store問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
本文主要介紹了vue項目中使用websocket的實現(xiàn)，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-01-01
這篇文章主要介紹了Vue3 實現(xiàn)雙盒子定位Overlay的示例，幫助大家更好的理解和使用vue，感興趣的朋友可以了解下2020-12-12
這篇文章主要介紹了vue中如何安裝使用jquery的教程，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04