Route
8596 ワード
Route
import React from "react";
import { BrowserRouter, Route, Switch } from "react-router-dom";
import GlobalStyle from "app/view/style/GlobalStyle";
import { View } from "app/view";
import { Layout } from "app/view/widgets/layout";
const App: React.FunctionComponent = () => {
return (
<BrowserRouter>
<GlobalStyle />
<Switch>
<Route
path={"/"}
render={() => {
return (
<Layout.TeamWrapLayout>
<Route path={"/team"} component={View.TeamView} />
<Route path={"/team/:teamId"} component={View.MemberListView} />
</Layout.TeamWrapLayout>
);
}}
/>
</Switch>
</BrowserRouter>
);
};
export default App;
subRoute
import React from "react";
import { BrowserRouter, Route, Switch } from "react-router-dom";
import GlobalStyle from "app/view/style/GlobalStyle";
import { View } from "app/view";
import { Layout } from "app/view/widgets/layout";
const App: React.FunctionComponent = () => {
return (
<BrowserRouter>
<GlobalStyle />
<Switch>
<Route path={"/team"} component={View.TeamView} />
</Switch>
</BrowserRouter>
);
};
export default App;
使用するビューロジックimport React, { ReactNode, useReducer } from "react";
import { Route } from "react-router-dom";
忘れないで
Reference
この問題について(Route), 我々は、より多くの情報をここで見つけました https://velog.io/@jaewon97/Routeテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol