Paparkan artikel WordPress terkini, dilaksanakan menggunakan Vue
P粉331849987
2023-08-29 15:45:38
<p>Saya sedang membina semula blog WordPress saya menggunakan Vue. Saya cuba memaparkan 3 catatan terakhir saya, saya melakukannya di sini: </p>
<pre class="brush:php;toolbar:false;"><template>
<bahagian>
<h4>Artikel terkini</h4>
<div class="siaran-terbaru">
<div v-for="(jawatan, indeks) dalam jawatan.slice(0, 3)"
<div :key="index">
<nuxt-link :to="`/blog/${post.slug}`"class="post-image"{ backgroundImage: 'url(' + post.fimg_url + ') ' }"></nuxt-link>
<div class="post-text">
<nuxt-link :to="`/blog/${post.slug}`"class="post-title" v-html="post.title.rendered"</nuxt- pautan>
</div>
</div>
</div>
</div>
</section>
</template>
<skrip>
import { mapState, mapActions } daripada 'vuex';
eksport lalai {
nama: 'Terbaru',
dicipta() {
this.getPosts();
},
alat peraga: {
slug: rentetan
},
dikira: {
...mapState(['posts']),
},
kaedah: {
...mapActions(['getPosts']),
}
};
</script></pre>
<p>Kod ini berfungsi dengan baik, tetapi saya mahu memaparkan 3 artikel sambil mengecualikan artikel semasa jika artikel semasa ialah salah satu daripada 3 artikel terbaharu. </p>
Jika anda mempunyai susunan artikel berikut
Anda boleh menggunakan kaedah
this.array.filter(post => post.slug !== this.$route.params.slug)
yang serupa untuk menapis.Pasal kalau
this.$route.params.slug
等于def
,它将只给出 id 为1
和3
.