qx-components

基础通用小组件

注册组件

import { applyPolyfills, defineCustomElements } from '@ibiz/exp-calendar/loader';

applyPolyfills().then(() => defineCustomElements(window));

基本用法

selectDateChange(evt: any){
    console.log(evt.detail.startDate);  //开始日期
    console.log(evt.detail.endDate);  //结束日期
}

render(){
    return <ibz-exp-calendar size='small' theme='blue' start-date='2021-01-01' end-date='2021-01-07' auto-complete on-select-change={(evt: any) => this.selectDateChange(evt)}></ibz-exp-calendar>
}

输入属性

| 属性 | 属性 | 描述与 | 类型 | 默认值 | | -------------- | --------------- | ----------- | ------------------ | ----------- | | autoComplete | auto-complete | 自动填充模式 | boolean | undefined | | completeDays | complete-days | 自动填充天数 | number \| string | 6 | | data | data | 日期内的数据量 | any | undefined | | endDate | end-date | 结束日期 | string | undefined | | maxTimeSpan | max-time-span | 最大时间跨度 | number | 7 | | size | size | 尺寸 | string | '' | | startDate | start-date | 起始日期 | string | undefined | | theme | theme | 主题 | string | '' |

事件

| 事件名 | 描述 | 类型 | | --------------- | -------------- | ------------------ | | select-change | 选中改变触发事件 | CustomEvent<any> |