Maison  >  Questions et réponses  >  le corps du texte

Afficher les derniers articles WordPress, implémentés avec Vue

<p>Je reconstruis mon blog WordPress en utilisant Vue. J'essaye d'afficher mes 3 derniers posts, je l'ai fait ici : </p> <pre class="brush:php;toolbar:false;"><template> <section> <h4>Articles récents</h4> <div class="posts-recents"> <div v-for="(post, index) dans posts.slice(0, 3)" :key="post.id" class="post"> <div :key="index"> <nuxt-link :to="`/blog/${post.slug}`" class="post-image" :style="{ backgroundImage : 'url(' + post.fimg_url + ') ' }"></nuxt-link> <div class="post-texte"> <nuxt-link :to="`/blog/${post.slug}`" class="post-title" v-html="post.title.rendered"></nuxt- lien> </div> </div> </div> </div> </section> </modèle> <script> importer { mapState, mapActions } depuis 'vuex' ; exporter par défaut { nom : 'Récent', créé() { this.getPosts(); }, accessoires : { limace : chaîne }, calculé : { ...mapState(['messages']), }, méthodes : { ...mapActions(['getPosts']), } } ; </script></pre> <p>Ce code fonctionne bien, mais je souhaite afficher 3 articles en excluant l'article en cours si l'article en cours est l'un des 3 articles les plus récents. </p>
P粉331849987P粉331849987416 Il y a quelques jours447

répondre à tous(1)je répondrai

  • P粉070918777

    P粉0709187772023-08-30 15:11:00

    Si vous disposez du tableau d'articles suivant

    [
      { id: 1, slug: 'abc', url: 'https://' },
      { id: 2, slug: 'def', url: 'https://' },
      { id: 3, slug: 'ghi', url: 'https://' },
    ]
    

    Vous pouvez utiliser une méthode this.array.filter(post => post.slug !== this.$route.params.slug) similaire à filter.
    Article si this.$route.params.slug 等于 def,它将只给出 id 为 13.

    répondre
    0
  • Annulerrépondre