@opendt/react-breadcrumbs-hoc

    1.0.1 • Public • Published

    介绍

    • 基于react-router-breadcrumbs-hoc封装的面包屑组件

    使用

    • 提供两个api,breadcrumbs,作为高阶组件引用,BreadcrumbsCom作为普通组件引用

    • 在不传参数的情况下,默认会引用路由作为面包屑路径,且如果是单词首字母会自动大写。

        import React from 'react';
        import { breadcrumbs } from 'react-breadcrumbs-hoc';
        
        class Comp extends React.Component {
          render() {
            return (
              <div className="App">
                <div>
                  <p>首页</p>
                </div>
              </div>
            );
          }
        }
      
        export default breadcrumbs()(Comp);
      
    • react-breadcrumbs-hoc 接收两个参数

      • 第一参数是个对象数组
      • 第二参数是个boolean值,默认true,即会展示根目录对应的link连接。设为false即不展示。
      • 在需要调用的的组件中
        import React from 'react';
        import { breadcrumbs, BreadcrumbsCom } from 'react-breadcrumbs-hoc';
      
        const routes = [
          { path: '/', breadcrumbs: '首页' },
          { path: '/user', breadcrumbs: '用户' },
        ]
      
        class Comp extends React.Component {
          render() {
            return (
              <div className="App">
                <div>
                  <p>首页</p>
                </div>
              </div>
            );
          }
        }
      
        export default breadcrumbs(routes, false)(Comp);
      
        import React from 'react';
        import { breadcrumbs } from 'react-breadcrumbs-hoc';
      
        const routes = [
          { path: '/', breadcrumbs: '首页' },
          { path: '/user', breadcrumbs: '用户' },
        ]
      
        class Comp extends React.Component {
          render() {
            return (
              <div className="App">
                <div>
                  <p>首页</p>
                  <BreadcrumbsCom routers={routes}, hasShowHomepage={true}/>
                </div>
              </div>
            );
          }
        }
      
        export default Comp;
      

    Install

    npm i @opendt/react-breadcrumbs-hoc

    DownloadsWeekly Downloads

    1

    Version

    1.0.1

    License

    none

    Unpacked Size

    13.4 kB

    Total Files

    5

    Last publish

    Collaborators

    • wangxinyu1
    • yeoyang