反応:aラベルとリンクの違い、どのように使うべきですか?


リアクターでは、ページのロードには2つの方法があります.
1.<a></a>使用
aタグを使用する方法は、既存のhtmlを使用する場合に使用する方法で、ページを再レンダリングしてスケールします.したがって、ページ移動時に新しいデータが再ロードされ、hrefを使用してパスを指定できます.
2.<Link></Link>使用
Routeが提供するリンクラベルは、1ページのアプリケーションに適していないという利点があります.このため、変更が必要な画面のみを再レンダリングし、残りのデータを保持して再使用します.これは、必要なデータのみをロードできるため、速度を向上させるのに役立ちます.link to移動の使用
import { BrowserRouter, Route, Switch, Link } from "react-router-dom";
import About from "./pages/About";
import Home from "./pages/Home";
import Profile from "./pages/Profile";
import NotFound from "./pages/NotFound";

function App() {
  return (
    <BrowserRouter>
      <Link to="/">Home</Link>
      <Switch>
        <Route path="/profile/:id" component={Profile} />
        <Route path="/profile" component={Profile} />
        <Route path="/about" component={About} />
        <Route path="/" exact component={Home} />
        <Route exact component={NotFound} />
      </Switch>
    </BrowserRouter>
  );
}

export default App;
制作意図に合わせて使うべきだと思います!