react路由配置

react路由配置
        1 安装react-router-dom 5.2.0 或者5.2.1
          npm i react-router-dom --save-dev
        2 在项目中创建router.js文件
          import { BrowserRouter, Route } from 'react-router-dom';

          class Router extends React.Component{
            render() {
              return (
                
                  
                     // 动态路由匹配   /路径/123  /路径/name
                
              )
            }
          }

          exact 为严格模式 
          strict 精确匹配

          export default Router

      3 在index.js文件中 引入 Router
        import Router from './Router'

        
          
        

        注意：
          在react-router-dom中有Link标签 相当于html里边a标签 或者 vue里边的router-link
          格式
            import {Link} from 'react-router-dom'

            1111

        路由组件传值
          1 使用斜杠传值
          格式：
            localhost:3000/topic/:id
            path='/topic/:id'
            获取参数id:
              this.props.match.params.id

          2 使用问号传值
            localhost:3000/topic
            path='/topic'

            /topic?id=123

            获取参数
              this.props.location.search

        路由重定向
          Redirect组件标签
          本来应该去path路径 直接跳转其他的path路径
          格式：
            


        嵌套子路由
          在进行路由匹配的时候 输入的一个路由地址为/app 渲染app组件
          /app/a  渲染a组件  但是 我们想让 同时显示app组件
          格式：
             
              
                
                
            }>

          想要在/app/a里边能够正常的显示出来a组件  我们需要在app组件里边使用 {this.props.children}来渲染嵌套子组件的内容


      react中将字符串的html转化为dom结构的html
      使用dangerouslySetInnerHTML={{__html:state数据}}  直接作为元素的标签属性来使用