当前位置: 首页 > 面试题库 >

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

魏凯捷
2023-03-14
问题内容

我到处都是关于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>
)

首先,在 应用程序 部件只有一个路径被声明/tacos。当用户导航到/tacos玉米饼
部件安装并且存在的下一个路由被html" target="_blank">定义/carnitas当用户导航到。所以/tacos/carnitas,在 猪肉丝 部件安装等。

因此,这里的路由是动态初始化的。



 类似资料:
  • 本文向大家介绍讲解vue-router之什么是动态路由,包括了讲解vue-router之什么是动态路由的使用技巧和注意事项,需要的朋友参考一下 前言: 今天我来给大家说道说道v-router,这是个什么东西?我们先从动态路由讲起。 GitHub:https://github.com/Ewall1106/mall/tree/master 1、动态路由有一个什么适用场景呢? 比如在写商品详情页面的时候

  • 问题内容: 我目前有一个内置路由的AngularJS应用程序。它可以正常工作,并且一切正常。 我的app.js文件如下所示: 我的应用程序内置了CMS,您可以在其中复制 / pages 目录中的新html文件并添加新的html文件。 即使对于新动态添加的文件,我仍然希望通过路由提供程序。 在理想的情况下,路由模式为: $ routeProvider.when(’/ pagename ‘,{temp

  • 我正在学习,并试图理解是什么使它比其他框架和库提供的解决方案更“快”和更特别。 我意识到以下几点: 以及React如何运行一个diff以采取最少的步骤来确定“更改”并相应地响应/重新呈现,而不是在其他框架/库中进行传统的“脏检查”操作。 以声明方式编程,而不是通过“可观察”模式强制实现。 因此,从概念上讲,上面的陈述对我来说都很好,但是,当我考虑现实生活中的用例和实践时,我无法想象其中的好处: >

  • 本文向大家介绍静态路由和动态路由之间的区别,包括了静态路由和动态路由之间的区别的使用技巧和注意事项,需要的朋友参考一下 静态路由 遵循用户定义的路由的静态路由或非自适应路由,并且直到网络管理员更改路由表后,路由表才会更改。静态路由使用简单的路由算法,并且比动态路由提供更高的安全性。 动态路由 顾名思义,动态路由或自适应路由会在网络发生任何更改或网络拓扑发生更改时更改路由表。在网络更改期间,动态路由

  • 问题内容: PHP中最新的静态绑定到底是什么? 问题答案: 您肯定需要阅读PHP手册中的Late Static Bindings 。但是,我将为您提供一个简短的摘要。 基本上,可以归结为以下事实:关键字不遵循相同的继承规则。 始终解析为使用它的类。这意味着,如果您在父类中创建方法并从子类中调用该方法,则不会像您期望的那样引用该子项。 后期静态绑定为关键字引入了新用法,从而解决了这一特殊缺点。当您使

  • 本文向大家介绍Javascript中的Prototype到底是什么,包括了Javascript中的Prototype到底是什么的使用技巧和注意事项,需要的朋友参考一下 Javascript也是面向对象的语言,但它是一种基于原型Prototype的语言,而不是基于类的语言。在Javascript中,类和对象看起来没有太多的区别。 什么是prototype: function定义的对象有一个proto