Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

    @beisen/beisen-scroll-barpublic

    beisen-scroll-bar

    功能

    BeisenScrollBar 
    

    使用方法

    import React, {Component, PropTypes} from 'react'
    import {render} from 'react-dom'
    import BeisenScrollBar from './src/index';
    //引入必须的依赖之后,我们引入要嵌入的组件或者html,和样式文件。
    import Containner from './src/outerComponent/containner';
    import './src/style/componentClass.scss'
    
    class Demo extends Component{
    
      handleScroll(scrollData){
          //这里我们可以获得坐标数据
          console.log(scrollData);
      }
    
      render () {
    
        //style可以设置滚动区域的整体样式。
        //当然支持手动加一个类,通过类名来控制样式(推荐)
        //contentClassName:为被包裹的内部页面套一个div,这里可以控制整个被嵌对象的样式。
        //handleScroll:回调函数,滚动时,实时获得滚动信息。
        //verticalScrollbarStyle:垂直滚动条的样式。
        //horizontalScrollbarStyle:水平滚动条的样式。
    
        let style = {'width':'300px','height':'300px'};
        let scrollbarStyles = {borderRadius: 5};
        return (
          <div>
              <BeisenScrollBar style={style} 
              className={'area'}
              contentClassName={'scrollContent'}
              handleScroll={this.handleScroll}
              verticalScrollbarStyle={scrollbarStyles}
              horizontalScrollbarStyle={scrollbarStyles}>
              
                <Containner />
    
              </BeisenScrollBar >
          </div>
        )
      }
    }
    render(<Demo />, document.getElementById('content'));
    
    

    参考资料

    install

    npm i @beisen/beisen-scroll-bar

    Downloadsweekly downloads

    17

    version

    1.0.33

    license

    ISC

    last publish

    collaborators

    • avatar