使用a-tabs做了一个三级菜单栏，可以正常使用但是存在一个小bug，刚刚打开的时候最后一级的内容不显示

使用a-tabs做了一个三级菜单栏，可以正常使用但是存在一个小bug，最后一级默认内容不显示，我这边有个，自己想了几个方法都无法解决，请教

<template>
    <a-drawer v-model:visible="visible" title="图片" bodyStyle="padding: 10px;" placement="right" :mask="false">
        <!-- <a-menu v-model:selectedKeys="current" mode="horizontal">
            <a-menu-item :key="`menu${index}`" v-for="(item, index) in logoList">
                {{ item.name }}
            </a-menu-item>
        </a-menu> -->
        <a-tabs v-model:activeKey="activeParentKey">
            <a-tab-pane :key="item.lclass_id" :tab="item.name" v-for="(item, index) in logoList"
                :style="{ height: '100%' }">
                <a-tabs v-model:activeKey="activeKey" tab-position="left" :style="{ height: '100%' }">
                    <a-tab-pane v-for="(myItem, myIndex) in item.children" :key="myItem.lclass_id" :tab="myItem.name"
                        force-render>
                        <a-space direction="vertical">
                            <a-card hoverable style="width:220px;height: 150px;" v-for="imageItem in myItem.children"
                                @dragstart="dragStart($event, imageItem.picture)" :key="imageItem.lclass_id">
                                <template #cover>
                                    <el-image style="width: 200px; height: 120px" :src="imageItem.picture" fit="contain" />
                                </template>
                            </a-card>
                        </a-space>
                    </a-tab-pane>
                </a-tabs>
            </a-tab-pane>
        </a-tabs>
    </a-drawer>
</template>

<script setup>
import { defineEmits, ref, defineProps, computed } from 'vue'
import { useStore } from 'vuex'
const store = useStore()
const props = defineProps(["logoVisible"])
const emit = defineEmits(["changeVisibel"])
const activeParentKey = ref(1)
const activeKey = ref(7)
const logoList = computed(() => {
    return store.state.logoList.list
})

const visible = computed({
    get() {
        return props.logoVisible
    },
    set(val) {
        emit("update:logoVisible", val)
    }
})

logoList就是a-tabs的数据，放入vuex

可以看到刚刚打开后服饰右边是空白的，没有数据 点击支付菜单栏就会出现数据，然后再点击服饰，就会出现数据，请问这是什么情况，为什么没有渲染呢，

点击后的效果：