React.Suspense -Вы не должны использовать а также по тому же маршруту; будет игнорироваться при попытке ленивой загрузки - PullRequest
Новая
       16

React.Suspense -Вы не должны использовать а также по тому же маршруту; будет игнорироваться при попытке ленивой загрузки

0 голосов
/ 02 апреля 2020

Я уже видел ветку:

Внимание: вы не должны использовать а также по тому же маршруту; будет игнорироваться

Я включил входы первого входа и избавился от первой проблемы - Предупреждение: Не следует использовать и по тому же маршруту; будет игнорироваться

Модифицированная маршрутизация: 

export const RoutedContent = () => {
    return (
        <Switch>
            <Redirect from="/" to="/dashboards/projects" exact />

            {/* <Route path="/dashboards/analytics" exact component={Analytics} /> */}
            {/* <ProtectedRoute path="/dashboards/analytics" exact>
                <React.Suspense fallback={ <Error404 /> }>
                    <Analytics />
                </React.Suspense>
            </ProtectedRoute> */}
            <ProtectedRoute path="/dashboards/analytics" exact render={() => <Analytics />} />
            .
            .
            .
        </Switch>
    );
};

Код защищенного маршрута: 

import React from 'react';
import { Route, Redirect } from "react-router-dom";
import auth from './auth';

export const ProtectedRoute = ({
    comp: Component, ...rest }) => {
    return (
        <Route
            {...rest}
            render={props => {
                if (auth.isAuthenticated()) {
                    return <Component {...props} />;
                }
                else {
                    return <Redirect to={
                        {
                            pathname: "/",
                            state: {
                                from: props.location
                            }
                        }
                    } />
                }
            }}
        />
    );
};

Класс аутентификации: 

class Auth {
    constructor(){
        this.authenticated = false;
    }

    login(cb){
        this.authenticated=true;
        cb();
    }

    logout(cb){
        this.authenticated=false;
        cb();
    }

    isAuthenticated(){
        return this.authenticated;
    }
}

export default new Auth();

Я хочу загрузить маршрут, когда он необходим, а не в самом начале - так как страниц будет слишком много. Поэтому я попытался 

            <ProtectedRoute path="/dashboards/analytics" exact>
                <React.Suspense fallback={ <Error404 /> }>
                    <Analytics />
                </React.Suspense>
            </ProtectedRoute>

Однако это возвращает ошибку.

...