zoukankan      html  css  js  c++  java
  • React Router概念

    React Router概念

    由于对于新版的Router的不熟悉,这节开始转向Router2和webpack1,等待React-Router4理解后,我会更新这几章
    Router
    以上Router采用的是Router2
    Router中文是路由的意思。
    路由库React-Router。它是官方维护的,事实上也是唯一可选的路由库。它通过管理 URL,实现组件的切换和状态的变化,开发复杂的应用几乎肯定会用到。
    基本用法

    $ npm install -S react-router安装React-Router,最新的为React-Router4。
    import React from 'react';
    import ReactDOM from 'react-dom';
    import Index from './index';
    import ComponentList from './components/list';
    import ComponentDetails from './components/details';
    import {Router,Route,hashHistory} from 'react-router';

    export default class Root extends React.Component{
    render(){
    return (
    //这里替换了之前的 Index,变成了程序的入口

        <Route component={Index} path="/">
          <Route component={ComponentDetails} path="details"></Route>
        </Route>
    
        <Route component={ComponentList} path="list"></Route>
    
      </Router>
    );
    

    };
    }

    ReactDOM.render(, document.getElementById('example'));
    跳转时使用进行跳转
    使用案例

    在src/js创建入口文件root.js
    在webpack中把

  • 相关阅读:
    linux 读写文件 open write lseek的API和应用
    gdb 常用命令
    makefile
    c/c++ 动态库与静态库的制作和使用
    linux 常用命令
    c/c++ 网络编程 陈硕老师视频理解之ttcp
    emacs 高亮
    初识HMTL标签
    Java集合基于JDK1.8的ArrayList源码分析
    Java提高篇——equals()与hashCode()方法详解
  • 原文地址:https://www.cnblogs.com/ArielChen/p/7467614.html
Copyright © 2011-2022 走看看