三掌柜 导读
在前端开发的时候，运行项目，遇到项目报错Unknown custom element:XXX - did you register the component correctly…的解决方法。该报错也是在前端开发过程中比较常见的，那么本文就来分享一下关于该报错的解决方法。
问题
前段时间在做前端项目的时候，遇到了一个关于饿了么框架的报错问题，具体报错信息如下所示：
[Vue warn]: Unknown custom element: <table-page> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
found in
---> <SocialFundAdjustList> at src/views/SocialFundManagement/SocialFundAdjustList.vue
<App> at src/App.vue
<Root>
[Vue warn]: Unknown custom element: <dialog-form> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
found in
---> <SocialFundAdjustList> at src/views/SocialFundManagement/SocialFundAdjustList.vue
<App> at src/App.vue
<Root>
[Vue warn]: Unknown custom element: <SearchCompany> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
found in
---> <SocialFundAdjustList> at src/views/SocialFundManagement/SocialFundAdjustList.vue
<App> at src/App.vue
<Root>
问题分析
通过分析上述几个错误提示，对于递归组件，需要提供name选项，也就是说没有注册自定义组件name或者是没有正确引入自定义组件，如果没有提供name选项就会报错。
解决方法
要想解决上述报错，需要进行下面的步骤操作。
1、查看是否注册组件
正确的注册组件方法，如下所示：
export default {
data(){
return{}
},
components: { //注册组件
TablePage,
DialogForm,
SearchCompany,
},
}
2、查看是否正确引入自定义组件
引入组件的时候一定要看清楚组件的路径，谨防写错。正确的引入组件的方法，具体如下所示:
<script> //引入组件
import TablePage from '@/components/comm/TablePage';
import DialogForm from '@/components/comm/DialogForm';
import SearchCompany from '@/components/comm/SearchCompany';
</script>
根据上述两个解决方法的对应排查报错问题的地方，即可解决上述报错问题，解决自定义组件引入不成功或者未注册造成的错误。以上就是本章全部内容，欢迎关注三掌柜的微信公众号“程序猿by三掌柜”，三掌柜的新浪微博“三掌柜666”，欢迎关注！
![[爱了]](/js/img/d1.gif)
![[尴尬]](/js/img/d16.gif)