169 похожих чатов

Привет. Вопрос по react router. Есть такой компонент import React,

{ Component } from 'react';
import './App.css';
import { Switch, NavLink, Route, withRouter } from 'react-router-dom';
import Card from './components/Card';

class App extends Component<any, any> {
render() {
return <>
<div className="app-container">
<div>App</div>
<Switch>
<Route path={'/card'} exact>
<Card/>
</Route>
<Route path={'/'} exact>
<NavLink to={'/card'}>card</NavLink>
</Route>
</Switch>
</div>
</>
}
}

export default withRouter(App);

и такой компонент Card
import { Component } from 'react';
import './styles.scss';
import { Route, Switch, NavLink, withRouter } from 'react-router-dom';
import { About } from '../About';


class Card extends Component<any, any> {
constructor(props: any) {
super(props);
}

render() {
return <>
<Switch>
<Route path={'/about'} exact>
<div>!!!!!!!!!!!!</div>
<About/>
</Route>
<Route path={'/card'} exact>
<div>Card</div>
<NavLink to={'/about'}>About</NavLink>
</Route>
</Switch>
</>
}
}

export default withRouter(Card);

проблема в том что не отрабывает переход по роуту /about, ничего не отрисовывается на этом роуте.

Как это пофиксить? точнее "как организовать вложенные роуты"

5 ответов

7 просмотров

Попробуй в App.js обернуть роуты в BrowserRouter

Вместо Switch

Евгений-Бар Автор вопроса
Max Zinchenko
Вместо Switch

попробовал, нет эффекта

Евгений Бар
попробовал, нет эффекта

В Card добавь импорт useRouteMatch

Евгений-Бар Автор вопроса
Max Zinchenko
В Card добавь импорт useRouteMatch

не подходит, нужно чтобы компонент остался классовым

Похожие вопросы

Обсуждают сегодня

Всем привет, написал код ниже, но он выдает сегфолт, в чем причина? #include <stdio.h> #include <stdlib.h> #include <string.h> struct product { char *name; float price; };...
buzz базз
32
Хотел бы спросить у знающих, правильную ли я выбрал книгу для начала изучения ассемблера Юрова В.И ? Или есть более лучшие книги для начала обучения?
Botsman
25
Книга Юрова В.И пойдёт для обучения?
Botsman
24
$params = [ 'formid' => 'feedbackForm', 'formTpl' => '@CODE: <form class="form-validate" data-id="ajax_form"> <fieldset class="margin-bottom-md"> ...
Pathologic
1
> Примечательно, что новый владелец удаляет из GitHub любые жалобы, указывающие на подозрительную активность или смену владельца, и, видимо, рассчитывает на то, что пользовате...
Alex Sherbakov
1
а мы ещё не созрели до того, чтобы создать отдельный чатик про настройку редакторов?
Cheese Syrowiecki
16
И ещё вопрос: можно ли типа как на дос как-то запариться и с помощью прерываний выводить текст, вместо функции printf ?
НѣкъиⰘижєжєиꙁъвьсєсвѣтьноѣсѣтиѥсть•
34
Всем привет! У меня почему-то по-разному отображается TListView в Debug и Release режимах (FireMonkey)! При запуске под Win приложения TListView заливается программо. в Debug ...
Александр COM
8
Ладно, ещё тупого спрошу. Код должен банально вывести значение регистра на консоль, на деле же не выводя ничего, просто оставляя нерабочую консоль (открыта, ничего не написан...
НѣкъиⰘижєжєиꙁъвьсєсвѣтьноѣсѣтиѥсть•
25
Hey there Which is the best Linux destro for developers (coding)? To my research on reddit, they said Linux mint is good for mid level spec and Ubuntu for high Lev hardwar...
Wiz 🪄
11
Карта сайта