Can I use useContent() and ContentRendererMarkdown?

Hi, I'm using nuxt-content to generate articles, but in some articles, I wanted to fetch a value from another article. Everything works correctly except for generating the ToC –

useContent()

useContent()

ignores everything that is fetched from

useAsyncData

useAsyncData

. How can I change this/delay the ToC generation until

useAsyncData

useAsyncData

has completed (because I think that's where the problem lies)?

GetCustom.vue:

<template>
    <div class="w-full">
        <ContentRendererMarkdown :value="data">
            <template #empty>
                <p>No content found.</p>
            </template>
        </ContentRendererMarkdown>
        <ContentSlot unwrap="p" />
    </div>
</template>
<script setup>
const props = defineProps({
    url: String
})
const { data } = await useAsyncData('article', () => queryContent('/external-markdown-files/' + props.url).findOne())
</script>

<template>
    <div class="w-full">
        <ContentRendererMarkdown :value="data">
            <template #empty>
                <p>No content found.</p>
            </template>
        </ContentRendererMarkdown>
        <ContentSlot unwrap="p" />
    </div>
</template>
<script setup>
const props = defineProps({
    url: String
})
const { data } = await useAsyncData('article', () => queryContent('/external-markdown-files/' + props.url).findOne())
</script>

MainArticle.md:

:GetCustom{url="article1"}

## Some heading

:GetCustom{url="article1"}

## Some heading

/external-markdown-files/article1.md:

## Heading 1
test
## Heading 2

## Heading 1
test
## Heading 2

ToC from

const { toc } = useContent()

const { toc } = useContent()

only includes headings from

MainArticle.md

MainArticle.md

(## Some heading)

Can I use useContent() and ContentRendererMarkdown?

Similar Threads

Similar Threads

Similar Threads