【Vite×React×Nest.js×PostgreSQL】React-Router-Domでページ遷移を制御する

サンプルイメージ

サイドバーの商品一覧リンクをクリックすると、

商品一覧画面に遷移する

ページ遷移の際、<a>タグを使いがちですが、ページリロードを引き起こさないためにLinkを使いましょう。

sample.tsx

import { Link } from "react-router-dom";

<Link to="/products/products-list" className="block py-1 hover:text-blue-400">
  商品一覧
</Link>

react-router-dom