<template>
    <template v-for="item in bookmarks" :key="item">
        <van-cell :title="item.title" :style="{ paddingLeft: `${level * 20 +30}px` }" 
        @click.prevent="clickCell(item.page)"/>
        <template v-if="item.children">
            <BookMarks @goToPage="$emit('goToPage', $event)" :level="level + 1" :bookmarks="item.children" />
        </template>
    </template>


</template>
<script setup name="BookMarks">
const $emit = defineEmits(["goToPage"]);
const props = defineProps({
    bookmarks: {
        type: Array,
        default: () => [],
    },
    level: {
        type: Number,
        default: 0,  // 默认层级是 0（第一层）
    },
});

const clickCell= (page)=>{
    $emit('goToPage',page)
}
</script>
<style lang="scss" scoped></style>