wordpress - 使用 Vue 显示最近的 WordPress 帖子
问题描述
我正在使用 Vue 重建我的 WordPress 博客。我正在尝试显示我在这里所做的 3 个最新帖子:
<template>
<section>
<h4>Recent Posts</h4>
<div class="posts-recent">
<div v-for="(post, index) in 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-text">
<nuxt-link :to="`/blog/${post.slug}`" class="post-title" v-html="post.title.rendered"></nuxt-link>
</div>
</div>
</div>
</div>
</section>
</template>
<script>
import { mapState, mapActions } from 'vuex';
export default {
name: 'Recent',
created() {
this.getPosts();
},
props: {
slug: String
},
computed: {
...mapState(['posts']),
},
methods: {
...mapActions(['getPosts']),
}
};
</script>
这很好用,但是如果该帖子是最近的 3 个帖子之一(同时仍显示 3 个帖子),我想排除当前帖子。
解决方案
如果您有以下文章数组
[
{ id: 1, slug: 'abc', url: 'https://' },
{ id: 2, slug: 'def', url: 'https://' },
{ id: 3, slug: 'ghi', url: 'https://' },
]
你可以用类似的东西过滤this.array.filter(post => post.slug !== this.$route.params.slug)
它们。
如果this.$route.params.slug
等于def
,它只会给你 id1
和的文章3
。
推荐阅读
- powerbi-desktop - sameperiodlastyear 当会计日历不是逐月时
- python - 初学者在 Python 中循环
- c# - Kendo mvc 在下拉列表中加入文本
- python - python的`in`函数在通过`__getitem__()`'触发时如何工作?
- r - R写表的2列持续时间比整个数据帧长
- android - 请求运行时权限 React Native
- azure - 将 SharePoint 常见问题解答加载到 Azure QnA maker
- facebook - 如何从 Facebook 应用程序中删除自己的开发者身份?
- php - Symfony 4:覆盖容器中的公共服务
- sql - BigQuery - 折叠具有连续日期的行