zoukankan      html  css  js  c++  java
  • react与react-router

    路由在单页应用极其常见,不论是angularjs项目还是react项目,都有路由。
    在react项目中使用路由,我们当然是全局安装react-router.
    第一步:
    第二步:创建几个要跳转到的页面

    第三步:配置routerMap

    注意,代码中path='detail/:id',最后一个标记表示参数,例如/detail/123这个123就是参数
    第四步:使用router

    这里的hashHistory,规定用 url 中的 hash 来表示 router
    第五步:页面跳转
    Home页

    List页
    我们在 List 页面中,使用 js 跳转。

    Detail页
    点击 List 页面就进入了Detail页面,我们还可以给Detail页面手动添加type属性

    快是前端页面优化的共同目标,如何让路由(即首页)加载的更快?其实也是让网页进入的更快。
    抛开代码效率问题,其中一个解决方案就是先不要加载其他页面的代码,即按需加载
    针对大型项目的静态资源懒加载问题,react-router 也给出了解决方案.

    本博客升华自:大众点评app视频。
    完整的demo见github:https://github.com/JserJser/reactWebApp/tree/master/react-router

  • 相关阅读:
    结对第一次—原型设计(文献摘要热词统计)
    第一次作业-准备篇
    Alpha冲刺Day9
    Alpha冲刺Day8
    Alpha冲刺Day7
    Alpha冲刺Day6
    Alpha冲刺Day5
    Alpha冲刺Day4
    Alpha冲刺Day3
    Alpha冲刺Day2
  • 原文地址:https://www.cnblogs.com/smart-girl/p/9684282.html
Copyright © 2011-2022 走看看