0.1.1 • Published 4 years ago

@stofe/sui-collect-select v0.1.1

Weekly downloads
2
License
MIT
Repository
-
Last release
4 years ago

title: 使用文档

并列选择器 sui-collect-select

使用场景

一般用于选择多个维度信息,需要提升页面利用率时

组件使用方式

$ snpm install @stofe/sui-collect-select --save

import CollectSelect from '@stofe/sui-collect-select'

组件库使用方式

$ snpm install @stofe/sui --save

import { CollectSelect } from '@stofe/sui'

API

参数说明类型默认值
configconfig是需要传入的需要展示的各项指标以及指标数据源的集合,必传array-
onChange内容选中后的回调函数,(value) => {}, value为内部各项的值function()=>{}

参数说明

config

config是一个数组,里面的每一项代表集成到该组件中的tab项, 其中每一项包括:

title

config = [
    { 
        title: { label: 'test', value: '0' }
    }
];

label是tab的标题,value是tab的key;

dataSource

config = [
    { 
        title: { label: 'test', value: '0' },
        dataSource: [
                        { label: 'listItem', value: '0' }
                    ]
    }
];

dataSource代表每个tab页签下的数据源

mode

config = [
    { 
        title: { label: 'test', value: '0' },
        dataSource: [
                        { label: 'listItem', value: '0' }
                    ],
        mode: 'multiple'
    }
];

mode 代表当前页签是多选模式还是单选模式,可选值single和mutiple

value

value 代表当前页签下选中的值,用于数据回显

config = [
    { 
        title: { label: 'test', value: '0' },
        dataSource: [
                        { label: 'listItem', value: '0' }
                    ],
        mode: 'multiple',
        value: '0'
    }
];