vue中递归组件可以与另一个组件循环引用吗？

Question

//ComponentA
<template>
    <ComponentA v-if="xxx>0"/>
    <ComponentB v-if="!show"/>
</template>

export default {
  name: 'ComponentA',
  components: { ComponentB:()=>import('./ComponentB.vue') },
 }
 

//ComponentB
<template>
    <ComponentA />
</template>
import ComponentA from './ComponentA.vue'
export default {
  name: 'ComponentB',
  components: { ComponentA },
 }

差不多是这样的结构，单独的ComponentA即递归的组件是没问题的
按照官方文档
https://cn.vuejs.org/v2/guide/components-edge-cases.html#组件之间的循环引用
写了循环引用就报错了：

Error in render: "TypeError: Cannot read property '0' of undefined"