<p>Ich versuche, ein Popup in einer gerenderten Liste mit benutzerdefiniertem Inhalt aus einer API-Anfrage zu öffnen. </p> <p>Derzeit habe ich den folgenden Code: </p> <pre class="brush:php;toolbar:false;"><template> <div class="biblio__all"> <a v-for="i in items" v-bind:key="i.id" <div class="biblio__text"> <h3 class="biblio__title">{{ i.gsx$titre.$t }}</h3> <p class="biblio__author">{{ i.gsx$auteur.$t }}</p> </div> </a> <div class="hidden">Fügen Sie den Inhalt des Popup-Fensters hier ein</div> </div> </template> <script lang="ts"> import { defineComponent } from „vue“; Standard exportieren defineComponent({ Daten () { zurückkehren{ Artikel: [], } }, erstellt(){ this.axios.get("///API URL") .then(response => (this.items = Response.data.feed.entry)) }, Methoden: { } }) </script></pre> <p>Ich möchte ein weiteres verstecktes Div im V-for haben und wenn ich auf den Link klicke, erscheint das Popup. </p> <p>Ich habe alle Daten für das Popup im Items-Array. </p>

data() {
    return {
        modalState: false
    }
}

<div class="biblio__all">
      <a v-for="i in items" v-bind:key="i.id" class="biblio__item">
          <!-- 拥有模态框和主要项目代码的组件 -->
          <subitem :item="i" />
      </a>

  </div>