fetch content according to a emitted payload

[RebelliousSmile]

Hi !

I'm really excited about new features of nuxt content. Maybe i try too hard tricks for my level still 😄
so...
i'm trying to write a component that will fetch data into md content and give them to template. On parent component, a select emits a event, with the name of the file as payload. i send it as a prop to the child component (right under here), and watch the prop to detect a change. all seems to work well until rendering. ContentDoc doesn't update its content object. I thought that the ContentDoc (or ContentRenderer) would change if one of its prop changes.

<script setup>
import { watch } from "vue";

const props = defineProps({
  // contient le nom du fichier markdown à appeler
  contentKey: {
    type: String,
    required: true,
  },
});

const oneContent = ref({});

/* on récupère le nom du nouveau contenu demandé, on va chercher le markdown et on récupère la data */
watch(
  () => props.contentKey,
  async (first, second) => {
    const { data: oneContent } = await useAsyncData("content-part", () =>
      queryContent("/questions/" + first).findOne()
    );
    console.log(oneContent.value._path); // affiche /questions/games dans la console
  }
);
</script>

<template>
  <div class="gap-8 row columns-3">
    <ContentDoc v-if="oneContent.value" :path="oneContent.value._path" />
  </div>
</template>

<style scoped></style>

How can i achieve to dynamically fetch content in relation with a select value ?

Thank you,