当前位置: 首页 > 网络应用技术

REACT-ROUTER6路由新功能(React-Router4 / 5和React-Router6比较摘要)

时间:2023-03-07 01:04:52 网络应用技术

  React-router6已经淘汰了一段时间。作者认为路线比路线更好。我不知道您是否有这样的感觉,尤其是在路由嵌套并通过配置文件渲染路线时,它并不酷。

  今天,我们比较React-Router4/5来总结新功能,希望能使朋友快速开始。

  该版本被删除并替换为替换。

  除了更换组件的功能外,还进行了一些更改。例如,一切都必须包裹在内,否则将被误解。

  版本组件发生了很大变化,并用属性删除了属性,因此它与以前的版本代码编写不兼容。

  移动组件,但您可以使用新组件与组件合作以实现重定向效果。

  在中间使用组件。

  需要组件与组件合作以实现重定向效果。

  无论您不知道组件都没关系,作者以后会谈论它。

  在中间,我们的路由组件将自动注入三个相关的路由属性以操作路由。

  它用于路由跳跃以获取参数以获取参数。

  而且不可能使用路由属性使用路由组件。类组件可以通过高端组件实现。可以使用高端组件软件包和三个功能组件实现功能组件。

  但是,在中间,路由组件不再自动注入三个与路由相关的属性。并删除高级别的组件。

  可以使用或实现路由跳跃。

  由于不再自动注入路由组件,因此我们无法再使用先前的方法来进行路由跳跃。

  新近用于替换路由跳跃的新产品,但是由于原因,它只能在函数组件中使用。

  如果该组件该组件我应该怎么办?我们可以查看官方解释。官员还建议我们自己封装高端组件,以便组件可以使用路线。

  我们可以用自己的高端组件包装我们的类组件,以在类组件中获取对象。

  在下面的示例中,作者假设类组件使用包裹。

  使用或实现路由跳跃。

  如前所述,路由组件不再自动注入三个与路由相关的属性。因此,获取参数的方法也已更改。

  支持三个参数。

  我们需要配置动态路由,然后在路由或功能组件中使用它。

  作者感觉非常不友好,没有很好的用处。如果您想使用urlsearchparams软件包。

  当使用页面刷新参数时,要传递参数的一点将丢失。

  用于使路由跳跃并传递。

  如前所述,不再注入路由组件。

  在课堂组件中,我们需要单独封装组件以以班级价格获得。

  我们将其用于函数组件。

  通过两点需要注意::

  我们需要配置动态路由。我们可以使用类包装的高端组件来获取它。在函数组件中使用。

  我们可以使用自己的包装高级别组件在类组中获得。它可以在功能组件中使用或获得。

  我们可以使用自己的包装高级别组件在类组中获取。您可以在功能组件中使用它。应该注意的是,使用时,页面刷新参数将丢失。

  使用使用它的学生嵌套的路由非常困难,至少作者觉得这样。

  但是路由雀巢的修改相对较大。修订后,使用非常相似。

  在中间,需要写入相应的子页面以混合业务代码和路由逻辑,这是非常不友好的。

  他在这里,在这里。有新的使用方式和非常友好的方式。子散发不需要完成父路线。它太酷了吗?

  作者的感觉是与之生活。

  在中间,以前的嵌套写作仍未被删除,但仅进行了一些更改。

  您需要注意两点:

  新的写作方式。

  当然,也支持整个路径,但没有必要。

  在中间,如果要实现类似的配置,则渲染路由是很麻烦的。但是如何使用它可以非常方便地实现它。

  首先我们需要定义

  在根部分中,我们需要使用遍历渲染的遍历并将路由通过传球。

  我们还需要通过子组件中的渲染来继续使用。

  这很复杂,但是我们可以使用插头来简化。

  首先安装

  在根组件中,我们只需要使用它。

  我们继续在子组件中使用。

  自己通过自己更方便吗?实际上,插件的内部实现与作者类似。

  可以更方便地实现。

  第一个定义

  在根组件中,我们只需要使用它。

  应该在这里注意到它,因此只能在功能组件或自定义组件中使用。

  在子组件中,我们可以继续使用渲染子组合。

  这很简单吗?感觉这条路线有点均匀。可以从路由嵌套和配置路由中看到,路由钩将在稍后更新。

  感谢朋友们观看了病人,本文是作者的个人研究笔记。如果本文对您有所帮助,请同样喜欢??,您的支持是作者不断更新的动机!

  原始:https://juejin.cn/post/7103731196856631327