React js,限制帖子显示



嗨,我只是做一个博客使用下一个js和图形cms,我只知道如何限制显示的帖子数量,例如,如果我有50个帖子在后台我只需要1个帖子显示,喜欢如何限制它?

这里,这就是我所说的

const posts = [
{title: 'Sample Post 1', description: 'Lorem ipsum dolor sit amet'},
{title: 'Sample Post 2', description: 'Lorem ipsum dolor sit amet'}
];
<div>
{
posts.map((posts, index) => (
<div>
<h1>{posts.title}</h1>
<p>{posts.description}</p>

</div>
))
}
</div>

如果我运行这所有的帖子将显示,无论如何在JS限制?

您可以使用slice

{
posts.slice(0,1).map((post, index) => (
<div>
<h1>{post.title}</h1>
<p>{post.description}</p>       
</div>
))
}

您可以使用.slice(0, 1)

的例子:

export default function Posts() {
const posts = [
{ title: "Sample Post 1", description: "Lorem ipsum dolor sit amet" },
{ title: "Sample Post 2", description: "Lorem ipsum dolor sit amet" },
{ title: "Sample Post 2", description: "Lorem ipsum dolor sit amet" },
{ title: "Sample Post 2", description: "Lorem ipsum dolor sit amet" },
{ title: "Sample Post 2", description: "Lorem ipsum dolor sit amet" },
{ title: "Sample Post 2", description: "Lorem ipsum dolor sit amet" },
];
return (
<div>
{posts.slice(0, 1).map((posts, index) => (
<div key={index}>
<h1>{posts.title}</h1>
<p>{posts.description}</p>
</div>
))}
</div>
);
}

最新更新