vue.js

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript类库 > vue.js > Vue3警告Failed to resolve component:XXX

Vue3警告:Failed to resolve component:XXX的详细解决办法

作者:P9ulp

最近在一个vue3项目中遇到了报错,整理了些解决办法,这篇文章主要给大家介绍了关于Vue3警告:Failed to resolve component:XXX的详细解决办法,文中介绍的非常详细,需要的朋友可以参考下

今天做小项目的时候遇到的问题,上网参考了几个大佬给出的解决方法

方法一:检查组件是否注册

没有注册组件,注册即可

方法二:检查组件名称是否有误

检查一下组件的名称有没有拼错or大小写有问题

方法三:defineComponent

将vue3中的defineComponent去掉

<script>
import { defineComponent } from "vue";
import layaside from "./Aside";
export default defineComponent({
  components: {
    layaside,
  },
  setup() {
    return {};
  },
});
</script>
<script>
import layaside from "./Aside";
export default {
  components: {
    layaside,
  },
  setup() {
    return {};
  },
};
</script>

后来我查了一下defineComponent主要是TS的时候用处比较大,JS也可以不需要。

方法四:组件互相嵌套

可能是你引用的组件互相嵌套,你中有我,我中有你,此时建议

1、把组件注册成全局组件

2、使用 webpack 的异步 import

components: {
  TreeFolderContents: () => import('./tree-folder-contents.vue')
}

方法五:是否是用对象包裹

以上方法我都试过了,最后解决的办法是将名称外包裹的花括号删除即可

总结

到此这篇关于Vue3警告:Failed to resolve component:XXX的详细解决办法的文章就介绍到这了,更多相关Vue3警告Failed to resolve component:XXX内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:
阅读全文