react 반복문(map, filter, forEach)에서 컴포넌트 호출하기

데이터를 가지고 오는데 사실 server에서 BestBoard만 가져오면 되는데

 

그거 하기 귀찮아서 그냥 통으로 데이터 긁어와서 BestBoard만 뽑아내 주고 싶어졌는데

 

컴포넌트 호출할때 조건을 쓰는게 끔찍하게도 어렵다.

 

암튼 찾은 방법은 filter로 조건을 처리하고 map으로 호출하면 된다.

 

{mainContent
          .filter((v) => v.title === "오늘의 인기글")
          .map((b) => (
            <BestBoardCard
              key={b._id}
              title={b.title}
              slug={b.slug}
              articleList={b.content}
            />
          ))}

 

사실 이것보다 더 좋은 방법은 그냥 서버쪽에서 데이터를 정렬해서 보내주고

우리는 최상위 성분을 가져다 쓰면 된다.

 

그냥 귀찮아서 위와같은 삽질을 했는데 해보니까 서버 정렬이 훨 낫다.

 

router.get("/board/list", async (req, res) => {
  const board = await Board.find().sort("_id");
  res.send(board);
});