Vue根元素

血泪教训了，在写vue3的时候，在一个组件的根元素（template中包了所有元素的叫根元素或根容器）写了 v-if="list.length>0" ，而 list 是父元素传进来的。这时候一开始 list 为空，页面的元素全部不会加载，也就是没有容器，

报错：Uncaught (in promise) TypeError: Cannot read properties of null (reading 'nextSibling')失去了页面的节点

我又去写了其他页面，再去运行的时候，首页有些地方被影响了不显示，跳转都出现问题了，找了很久才找到，粗心大意了

<template>
  <el-carousel :interval="3000" class="swiper" trigger="click" height="435px" v-if="list.length>0">
    <el-carousel-item v-for="(item, index) in list" :key="index">
      <!-- 图片 -->
      <img class="swiper-img" :src="item.photos" />
      <!-- 标题 -->
      <!-- <div class="swiper-title">
        <p>{{ item.name }}</p>
      </div> -->
    </el-carousel-item>
  </el-carousel>
</template>

const props = defineProps({
  list: {
    type: Array,
    default: [],
  },
});