Rekursi dalam komponen fail tunggal dalam Vue.js 3

Question

Bagaimana untuk menggunakan komponen rekursif dalam Vue3?

Menggunakan komponen rekursif seperti komponen biasa dalam Vue 3 mengakibatkan ralat 初始化前无法访问

Tree.vue:

<template>
  <Tree v-if="hasChildren" />
</template>

<script lang="ts">
import Tree from './Tree.vue';

export default defineComponent({
  components: {
    Tree
  },

  setup() {

    const hasChildren = someExitRecursionCondition();

    return {
      hasChildren
    }
  }
</script>

Answer 1

Anda hanya boleh memberikan pilihan nama komponen:

sssccc

Answer 2

Dokumentasi:

Komponen boleh diimport mengikut nama failnya, tetapi tidak perlu disenaraikan dalam objek tetapan components. Walau bagaimanapun, cukup untuk menggunakan komponen yang dinamakan dalam templat tanpa mengimportnya.

Tree.vue:

sssccc