多级嵌套引入组件导致Vue提示子组件未注册问题

发生此问题的时候是页面解析的时报错的, 所以可以放在beforeCreate中执行注册组件这个时候是在页面运行时执行的,运行时编译就结束了

第一种:可以在父组件中动态注册组件

export default{
  beforeCreate(){
        //require是commonJS,commonJS导入ESModules,需要在最后加一个default,因为是默认导出
      this.$options.components.sonComponent = require('./sonComponent.vue').default;  
  }
}

第二种:在父组件进行动态导入组件,这也是解析之后,网页运行时执行的import

export default{
    components:{
        sonComponent:()=>import('./sonComponent.vue')
    }
}

第三种就是全局引入的方式,在main.js中

//main.js
import Vue from 'vue'
import sonComponent from '@/components/sonComponent'
Vue.component(sonComponent.name,sonComponent);

你可能感兴趣的:(vue.js,前端,javascript)