国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

Vue中使用API??內(nèi)容渲染的彈出清單的開(kāi)啟方式
P粉212971745
P粉212971745 2023-08-28 19:21:43
0
1
581
<p>我正在嘗試在渲染的清單中使用來(lái)自API請(qǐng)求的自訂內(nèi)容打開(kāi)彈出視窗。 </p> <p>目前,我有以下程式碼:</p> <pre class="brush:php;toolbar:false;"><template> <div class="biblio__all"> <a v-for="i in items" v-bind:key="i.id" class="biblio__item"> <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">這裡放彈出視窗的內(nèi)容</div> </div> </template> <script lang="ts"> import { defineComponent } from "vue"; export default defineComponent({ data () { return{ items: [], } }, created(){ this.axios.get("///API URL") .then(response => (this.items = response.data.feed.entry)) }, methods: { } }) </script></pre> <p>我希望在v-for中有另一個(gè)隱藏的div,當(dāng)我點(diǎn)擊連結(jié)時(shí),彈出視窗出現(xiàn)。 </p> <p>我在items數(shù)組中有彈出視窗的所有資料。 </p>
P粉212971745
P粉212971745

全部回覆(1)
P粉063039990

你可以為每個(gè)專案建立一個(gè)單獨(dú)的元件,並在該元件中處理其模態(tài)狀態(tài)。你可以使用bootstrap、bulma或純html、css來(lái)製作模態(tài)框。使用v-show="modalState"來(lái)隱藏或顯示模態(tài)框。在你的子元件中定義modalState

data() {
    return {
        modalState: false
    }
}

你的最終結(jié)構(gòu):

<div class="biblio__all">
      <a v-for="i in items" v-bind:key="i.id" class="biblio__item">
          <!-- 擁有模態(tài)框和主要項(xiàng)目代碼的組件 -->
          <subitem :item="i" />
      </a>

  </div>
最新下載
更多>
網(wǎng)站特效
網(wǎng)站源碼
網(wǎng)站素材
前端模板