Nature Preceded Machines

    bee-slider

    2.0.2 • Public • Published

    bee-slider

    npm version Build Status Coverage Status devDependency Status NPM downloads Average time to resolve an issue Percentage of issues still open

    react bee-slider component for tinper-bee

    some description...

    Slider

    滑动型输入器,展示当前值和可选范围。 当用户需要在数值区间/自定义区间内进行选择时,可为连续或离散值。

    使用方法

    import Slider from 'bee-slider';
    
    React.render(<Slider defaultValue={20}/>,
             document.getElementById('target'));
    

    样式引入

    <link rel="stylesheet" href="./node_modules/bee-slider/build/Slider.css">
    //或是
    import "./node_modules/bee-slider/src/Slider.scss"
    //或是
    import "./node_modules/bee-slider/build/Slider.css"
    

    API

    参数 说明 类型 默认值
    min 最小值,默认0 number 0
    max 最大值,默认100 number 100
    step 步长,取值必须大于0,并且可被(max-min)整除。当marks不为空对象时,可以设置step为null,此时Slider的可选值仅有marks标出来的部分,默认1 (number OR null) 1
    dots 是否只能拖拽到刻度上,默认是false boolean false
    marks 刻度标记,key的类型必须为number且取值在闭区间min,max内,每个标签可以单独设置样式。格式是{number:string}或者{number:{style:object,label:string}} object -
    value 设置当前取值。当range为false时,使用number,否则用[number,number] number OR [number,number] 0 OR [0,0]
    defaultValue 设置初始取值。当range为false时,使用number,否则用[number,number] number OR [number,bumber] 0 OR [0,0]
    className 增加额外的class string ''
    included marks不为空对象时有效,值为true时表示值为包含关系,false表示并列 boolean true
    disabled 值为true时,滑块为禁用状态 boolean false
    vertical 值为true时,Slider为垂直方向 Boolean false
    railStyle 自定义u-slider-rail的样式 Object -
    trackStyle 自定义u-slider-track的样式 Object -
    handleStyle 自定义u-slider-handle的样式 Object -
    dotStyle 自定义u-slider-dot样式 Object -
    activeDotStyle 自定义u-slider-dot-active样式 Object -
    onChange 当Slider的值发生改变时,会触发onChange事件,并把改变后的值作为参数传入。 Function(value) NOOP
    onAfterChange 与onmouseup触发时机一致,把当前值作为参数传入。 Function(value) NOOP
    tipFormatterSlider 会把当前值传给tipFormatter,并在Tooltip中显示tipFormatter的返回值,若为null,则隐藏Tooltip。 Function -

    开发调试

    $ npm install -g bee-tools
    $ git clone https://github.com/tinper-bee/bee-slider
    cd bee-slider
    $ npm install
    $ npm run dev

    Install

    npm i bee-slider

    DownloadsWeekly Downloads

    176

    Version

    2.0.2

    License

    MIT

    Unpacked Size

    148 kB

    Total Files

    36

    Last publish

    Collaborators

    • honely1314
    • xiaoshutong
    • yonyoufed
    • jonyw
    • guoyongfeng
    • kvkens
    • whizbz
    • npm_yx
    • bjyxszd
    • tinper-bot
    • houjitong
    • gaox2025f
    • gcht163
    • cnkvkens
    • diozhu
    • wangjings123
    • ahua52