vue3组件引用使用的坑

今天准备用el-tabs写个页面，发现点击后组件怎么都显示不了，后来才发现是组件引用的原因

 这是页面是显示的效果：

 乍一看确实是对的。。。

但是当我点击完这三个tab后再重新点击道路管理后，有意思的出现了：

 one组件消失不见了，不仅如此，另外两个组件也不显示了。。。

这里看见控制台报了一个这样的警告：

index.vue:34 [Vue warn]: Invalid vnode type when creating vnode: null. 
  at <ElTabPane label="道路管理" name="first" > 
  at <ElTabs modelValue="first" onUpdate:modelValue=fn class="demo-tabs"  ... > 
  at <MyComponent> 
  at <MyComponent$1689578690715 onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< Proxy(Object) {$i18n: {…}, $t: ƒ, $rt: ƒ, …} > key="/road_network/index" > 
  at <KeepAlive key=0 include= [] > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="fade-transform" mode="out-in" > 
  at <RouterView> 
  at <ElCard class="base-content-box-noFooter hasHeight" > 
  at <ElMain> 
  at <ElContainer class="zq-right-box" > 
  at <ElContainer style= {height: '100vh'} class="zq-app-content-box" > 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< Proxy(Object) {__v_skip: true} > > 
  at <RouterView> 
  at <ElConfigProvider locale= {name: 'zh-cn', el: Proxy(Object)} size="default" > 
  at <App>

网上查了一下是因为组件引用的时候要使用大驼峰命名

 后来该、改完了之后，页面就正常显示了