Nuxt3嵌套路由,報(bào)錯(cuò)Failed?to?resolve?component:?NuxtChild的解決
更新時(shí)間：2023年06月30日 08:51:03 作者：Dreams゜
這篇文章主要介紹了Nuxt3嵌套路由,報(bào)錯(cuò)Failed?to?resolve?component:?NuxtChild的解決方案，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
問(wèn)題報(bào)錯(cuò)
[Vue warn]: Failed to resolve component: NuxtChild If this is a native
custom element, make sure to exclude it from component resolution via
compilerOptions.isCustomElement.
運(yùn)行的時(shí)候控制臺(tái)報(bào)錯(cuò)，子組件child.vue中的內(nèi)容也顯示不了。
文件目錄
代碼
app.vue中的代碼
<template>
<div>
<!-- 顯示pages中index.vue的內(nèi)容 -->
<NuxtPage></NuxtPage>
</div>
</template>index.vue中的代碼
<template>
<div>
<!-- 路由跳轉(zhuǎn)到parent下面的child -->
<NuxtLink to="/parent/child">跳轉(zhuǎn)</NuxtLink>
</div>
</template>parent.vue中的代碼
<template>
<div>
這是父組件內(nèi)容
<NuxtChild></NuxtChild>
</div>
</template>child.vue中的代碼
<template>
<div>這是子組件內(nèi)容</div>
</template>解決方案
把parent.vue中的<NuxtChild></NuxtChild>改成<NuxtPage></NuxtPage>就可以正常顯示了，改完后控制臺(tái)不報(bào)錯(cuò)了，child.vue子組件的內(nèi)容也能正常顯示了
總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了vue router路由嵌套不顯示的問(wèn)題，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下vue-router 路由嵌套不顯示問(wèn)題2017-06-06
webpack4+Vue搭建自己的Vue-cli項(xiàng)目過(guò)程分享
這篇文章主要介紹了webpack4+Vue搭建自己的Vue-cli，對(duì)于vue-cli的強(qiáng)大,使用過(guò)的人都知道,極大的幫助我們降低了vue的入門門檻,感興趣的朋友跟隨腳本之家小編一起看看吧2018-08-08
vue+elementUI的表格最后一行合計(jì)自定義顯示方式
這篇文章主要介紹了vue+elementUI的表格最后一行合計(jì)自定義顯示方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06
本文主要介紹了前后端分離項(xiàng)目中的跨域問(wèn)題,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2024-12-12
Vscode關(guān)閉Eslint語(yǔ)法檢查的多種方式(保證有效)
eslint是一個(gè)JavaScript的校驗(yàn)插件,通常用來(lái)校驗(yàn)語(yǔ)法或代碼的書寫風(fēng)格,下面這篇文章主要給大家介紹了關(guān)于Vscode關(guān)閉Eslint語(yǔ)法檢查的多種方式,文章通過(guò)圖文介紹的非常詳細(xì),需要的朋友可以參考下2022-07-07
這篇文章主要介紹了VueJs組件之父子通訊的方式，非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2018-05-05
當(dāng)我們談?wù)揤ue的組件擴(kuò)展時(shí),經(jīng)常會(huì)遇到mixin和extends這兩個(gè)關(guān)鍵詞,它們提供了一種有效的方式來(lái)共享和重用組件邏輯,本文將深入探討Vue中mixin和extends的使用方法,并詳細(xì)探討它們的覆蓋邏輯,以便你在實(shí)際項(xiàng)目中能夠更好地應(yīng)用它們2023-08-08
Vue將將后端返回的list數(shù)據(jù)轉(zhuǎn)化為樹(shù)結(jié)構(gòu)的實(shí)現(xiàn)
本文主要介紹了Vue將將后端返回的list數(shù)據(jù)轉(zhuǎn)化為樹(shù)結(jié)構(gòu)的實(shí)現(xiàn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-05-05
Vue獲取當(dāng)前系統(tǒng)日期(年月日)的示例代碼
發(fā)中會(huì)有要獲取當(dāng)前日期的需求,有的是獲取到當(dāng)前月份,有的是精確到分秒,在 Vue 開(kāi)發(fā)中,獲取當(dāng)前時(shí)間是一項(xiàng)常見(jiàn)的需求,本文將深入探討Vue獲取當(dāng)前系統(tǒng)日期(年月日),幫助您更好地利用當(dāng)前時(shí)間,需要的朋友可以參考下2024-01-01
vue實(shí)現(xiàn)文章內(nèi)容過(guò)長(zhǎng)點(diǎn)擊閱讀全文功能的實(shí)例
下面小編就為大家分享一篇vue實(shí)現(xiàn)文章內(nèi)容過(guò)長(zhǎng)點(diǎn)擊閱讀全文功能的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2017-12-12