React Router Deep Link 与动态

Question

我想要动态路由的深层链接
我的代码是这个

import React from 'react';
import { BrowserRouter as Router, Switch, Route, Link } from "react-router-dom";

import Home from '../Routes/Home';
import Add from '../Routes/Add';
import Region from '../Routes/Region';
import Stores from '../Routes/Region/Stores';

function App() {
  return (
    <div className="App">
            <Router>
                <Switch>
                    <Route exact path="/" component={Home} />
                    <Route path="/addBook" component={Add} />
                    <Route path="/:region" component={Region} />
                    <Route path="/:region/:store" component={Stores} />
                </Switch>
                <Link to={`/${"ulsan"}`}>
                    <button>go</button>
                </Link>
            </Router>  
    </div>
  );
}

export default App;

我的地区页面是这个

import React from 'react';
import { Link } from 'react-router-dom';

function Region() {
    const store = "hello"
    return(
        <>

                <Link to={`/${"ulsan"}/${store}`}>
                    <button>store</button>
                </Link>
            <div>Region</div>
        </>
    )
}

export default Region;

当我点击商店按钮时，页面停留在区域
我不知道如何使用动态路由移动 Stoer 页面
问题是什么？？？

对不起我英语不好

Answer 1

问题是你如何声明你的路线，你需要添加确切的属性：

<Route exact path="/:region" component={Region} />