例如：組件A，組件A裏有一個子組件C和D，組件C的子組件又引用了組件D，這種情況會報警告
循環調用組件時，組件比vue實例後創建，官方文檔裏寫組件必須先於實例化引入，所以說組件沒有正確的引入。
Vue.component 全局註冊組件時，組件循環引用可以解開。全局引入組件，並且在vue實例化前。
import PosterTemplate from '@/components/SmartPoster/Template'
Vue.component('PosterTemplate', PosterTemplate)
當組件不是全局註冊的時候 我們使用遞歸組件需要經過處理才使用
解決方案：
方案一
推薦使用 webpack的異步組件 通過 import 引入如下
異步組件的註冊是一個箭頭函數
components: {
PosterTemplate: () => import('./Template.vue')
},
方案二
beforeCreate: function () {
//beforeCreate () {
// 官方文檔給出的是require
// this.$options.components.PosterTemplate = require('./Template.vue')
// 在基於[email protected]按照上面的寫法還是會報錯
// Failed to mount component: template or render function not defined.
// 所以我們應該改爲基於es6的寫法異步加載一個組件如下
this.$options.components.PosterTemplate = () => import('./Template.vue')
},
注意：vue 生命週期函數不可用箭頭函數 beforeCreate （methods裏面的函數同樣道理）
因爲箭頭函數是和父級上下文綁定在一起的，this 不會是如你所預期的 Vue 實例，經常導致報錯
vue Error in beforeCreate hook: "TypeError: Cannot read property '$options' of undefined"
參考資料：
1、https://cn.vuejs.org/v2/guide...
2、https://cn.vuejs.org/v2/guide...