Paparkan artikel WordPress terkini, dilaksanakan menggunakan Vue
P粉331849987
P粉331849987 2023-08-29 15:45:38
0
1
489
<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>
P粉331849987
P粉331849987

membalas semua(1)
P粉070918777

Jika anda mempunyai susunan artikel berikut

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

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 为 13.

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan