"TypeError: Cannot read properties of undefined (reading 'xxx')"

多个子组件调用

在查看本文前，希望各位可以好好看看这一篇文章：该报错的单个组件解决方案

在网上查找时看到的比较好的解答，推荐详细看看

多组件使用以下方案：

由于多组件时，在父组件使用status，status的状态无法复用，所以将status放到子组件中

子组件HTML部分：

<template>
    <div v-if="status">
          {{ index[0].text }}
    </div>
</template>

子组件JavaScript部分：

export default {
    props: ['index'],
    data() {
        return {
          status: false,
        }
    },
    mounted() {
        this.status = true;
    },
}

这样做是为了让每个子组件在获取到数据后再渲染