<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 :bookmarks="bookmarks" @goToPage="goToPage" />
    </template>
  </template>
</template>
<script setup name="BookMarksPc">
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>
