Skip to content

Response Toolbar 响应式工具条

Response Toolbar 是一个可以根据屏幕尺寸自定义调整显示按钮个数的工具条组件。

基本用法

显示图标

显示提示

是否可见

对齐方式

自定义样式

类型

typescript
// 工具条对齐方式
type ButtonAlignment = 'left' | 'right' | 'center'

// 按钮属性
interface ResponseToolbarItem {
    /** 工具栏项标识 */
    id: string;
    /** 图标 */
    icon: string;
    /** 文本 */
    text: string;
    /** 是否可用 */
    enable: boolean;
    /** 是否可见 */
    visible: boolean;
    /** 点击事件
     * $event: 鼠标点击事件对象
     * itemId: 当前点击的按钮标识 */
    onClick: ($event: MouseEvent, itemId: string) => void = () => {};
    tipsEnable?:boolean;
    tipsText?:string;
}

属性

属性名类型默认值说明
customClassString工具条自定义样式
alignmentButtonAlignmentright工具条对齐方式
itemsArray<ResponseToolbarItem>[]按钮列表
visibleBooleantrue是否可见,默认可见

插槽

TIP

暂无内容