Как правильно обернуть маршруты вact-router v5?

Question

проблема, когда я открываю /view весь маршрут BaseLayout рендеринг, и я пробовал много разных способов до сих пор не повезло

import React from 'react';
import { BrowserRouter as Router, Route } from "react-router-dom";
    function App() {
      return (
        <Router>
                <Root>
                    <Route path="/" exact component={Home}/>
                    <BaseLayout>
                        <Route path="/dashboard" exact component={Dashboard} />
                        <Route path="/sa" exact component={sample} />
                    </BaseLayout>
                    <Route path="/view" exact component={Post} />
                </Root>
        </Router>
      );

    }

Answer 1

Если вы используете render реквизиты вместо component и если вы оборачиваете компонент, который вы хотите визуализировать, используя BaseLayout, как указано выше, он должен работать:

import React from 'react';
import { BrowserRouter as Router, Route } from "react-router-dom";
    function App() {
      return (
        <Router>
                <Root>
                    <Route path="/" exact component={Home}/>
                    <Route path="/dashboard" exact render={() => (
                      <BaseLayout><Dashboard /></BaseLayout>
                    )} />
                    <Route path="/sa" exact render={() => (
                      <BaseLayout><sample /></BaseLayout>
                    )} />
                    <Route path="/view" exact component={Post} />
                </Root>
        </Router>
      );

    }