1.0.2 • Published 7 years ago

re-slider-table v1.0.2

Weekly downloads
1
License
MIT
Repository
github
Last release
7 years ago

re-slider-table

a slideable table component base on swiper(https://github.com/nolimits4web/Swiper)

Install

npm install re-slider-table --save

Usage

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import SliderTable from 're-slider-table';

class Basic extends Component {
    render() {
        const header = [{
            key: 'c0',
            value: 'c0',
        }, {
            key: 'c1',
            value: 'c1',
        }, {
            key: 'c2',
            value: 'c2',
        }, {
            key: 'c3',
            value: 'c3',
        }, {
            key: 'c4',
            value: 'c4',
        }, {
            key: 'c5',
            value: 'c5',
        }];

        const data = [{ c0: 'c0', c1: 'c1', c2: 'c2', c3: 'c3', c4: 'c4', c5: 'c5' },
          { c0: 'c0', c1: 'c1', c2: 'c2', c3: 'c3', c4: 'c4', c5: 'c5' },
          { c0: 'c0', c1: 'c1', c2: 'c2', c3: 'c3', c4: 'c4', c5: 'c5' },
          { c0: 'c0', c1: 'c1', c2: 'c2', c3: 'c3', c4: 'c4', c5: 'c5' },
          { c0: 'c0', c1: 'c1', c2: 'c2', c3: 'c3', c4: 'c4', c5: 'c5' }];

        return <SliderTable title="test" header={header} data={data} />;
    }
}

ReactDOM.render(<Basic />, document.getElementById('root'));

API

propstypedefaultdescription
titlePropTypes.string.isRequired表格标题
headerPropTypes.array.isRequired列表标题
dataProTypes.array.isRequired表格数据
headerWidthPropTypes.string36%固定表头的宽度
baseClassNamePropTypes.stringslider-table组件类名
defaultValuePropTypes.string--表格数据为空时默认显示的内容
columnNumPropTypes.number2每个一个滑片的列数
slideablePropTypes.boolfalse是否支持滑动

LICENSE

MIT