标签引入 Vue 的情况下，递归调用自定义组件

2023-10-21

组件定义

<script type="text/x-template" id="docSectionItem">
    <div class="doc-section-item-container">
        @{ row.title }
        <div class="doc-section-item-children" v-if="row.children && row.children.length > 0">
            <doc-section-item
                style="margin-left: 20px;"
                v-for="(v, k) in row.children"
                :key="k"
                :row="v">
            </doc-section-item>
        </div>
    </div>
</script>

<script>
Vue.component('doc-section-item', {
        template: '#docSectionItem',
        delimiters: ['@{', '}'],
        props: {
            row: {
                type: Object,
                default: () => ({})
            }
        },
    })
</script>

引用

<doc-section-item :row="v"></doc-section-item>