ReactJS中的动态路由到底是什么

Z时代
2024-01-10
分类：问答

我到处都是关于React动态路由的信息。但是我找不到任何可以解释其工作原理以及与静态路由在各个方面都有何不同的东西。

当我们想使用React-Route在同一页面中渲染某些东西时，我非常了解事情的发展。

我的问题是，当要渲染整个新页面时，它如何工作？因为在这种情况下，必须重新呈现该页面内的所有DOM。因此，这将是静态路由吗？还是在某些方面还是动态的？

我希望我已经清楚了。感谢您预先提供的答案，谢谢！

回答：

我认为上面的解释对于和路由是不正确的，网络上也没有太多解释，但是React Router

Docs中有一个很好的解释。来自文档

如果您使用过Rails，Express，Ember，Angular等，则使用了静态路由。在这些框架中，您将在进行任何渲染之前将路由声明为应用程序初始化的一部分。React
Router pre-v4也是静态的（大部分是静态的）。让我们看一下如何在express中配置路由：

在静态路由中，声明路由并其导入顶层。

而在动态路由中

当说动态路由时，是指在您的应用渲染时发生的路由，而不是在运行中的应用之外的配置或约定中进行。

因此，在动态路由中，路由。上面答案中解释的示例均用于静态路由。

对于动态路由，它更像

const App = () => (
    <BrowserRouter>
        {/* here's a div */}
        <div>
        {/* here's a Route */}
        <Route path="/tacos" component={Tacos}/>
        </div>
    </BrowserRouter>
)
// when the url matches `/tacos` this component renders
const Tacos  = ({ match }) => (
    // here's a nested div
    <div>
        {/* here's a nested Route,
            match.url helps us make a relative path */}
        <Route
        path={match.url + '/carnitas'}
        component={Carnitas}
        />
    </div>
)