reactjsnext.jsgraphcms

React js, limiting post shown


Hi i am just making a blog using next js and graph cms,i just know how to limit the number posts shown, for example if i have 50 posts in the backend i just need 1 post to show, like how to limit it?

here, this is what i am talking about

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>

if i run this all the post will be show, is there anyway to limit in JS?


Solution

  • you can use slice

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