我如何得到我所有的帖子在一个类别中显示在React?

Question

目前我使用UseParams来查找某个类别内的所有帖子。下面的分类是"短篇小说"。但只有第一个帖子出现了。我怎样才能找到所有有"短篇故事"的帖子呢?类别?提前感谢。下面是我的短篇故事博客页面和一个JSON文件的片段，其中存储了数据。

import React, { useState } from 'react';
import { BrowserRouter as Router, Routes, Route, Link, useNavigate, useParams  }
from "react-router-dom";


export default function ShortStories ({ posts, setCart, cart,  }) {
const { category } = useParams();
const post = posts.find(post => post.category === "SHORT_STORIES");

return (
<>
<h1>Short Stories</h1>

<Link to="/ShortStories"><button type="button">Short Stories</button></Link>
<Link to="/KentBased"><button type="button">Kent Based</button></Link>
<Link to="/Blog"><button type="button">All</button></Link>

<div className="products">
<div className="product">
<h3>{post.name}</h3>
<h4>£{post.cost}</h4>
<img src={post.image} alt={post.name} />
<br />


<Link to={`/SingleBlog/${post.id}`}><button type="button">View 
Post</button></Link>

</div>
</div>
</>
);
}

和一个片段从JSON文件

{
"postsData" :
[
{
"id": "0001",
"category": "SHORT_STORIES",
"name": "Blueberry Muffins (Pages 4 & 5)",
"image":"/images/BlueberryMuffins.jpg",
"main": "SOME BLOG POST 1"
},
{   "id": "0002",
"category": "SHORT_STORIES",
"name": "Cheese on Toast (Page 3)",
"image":"/images/cheese.jpg",
"main": "SOME BLOG POST 2"
}
]}

Answer 1

当你看一下find的文档时它说它返回第一个Value代替all.

用filter代替

const post = posts.filter(post => post.category === "SHORT_STORIES");