cloud-ui.vusion
Version:
Vusion Cloud UI
214 lines (213 loc) • 6.64 kB
YAML
- name: m-complex
title: 复合模式
description: 一个组件中,通过`multiple`属性切换单选还是多选的模式。
extends: m-singlex, m-multiplex
attrs:
- name: value
type: any
sync: true
model: true
default: null
description: 当前选择的值
- name: auto-select
type: boolean
default: false
description: 是否自动选择第一个非禁用的项
- name: cancelable
type: boolean
default: false
description: 是否可以取消选择
- name: multiple
type: boolean
default: false
description: 是否切换为多选模式
- name: readonly
type: boolean
default: false
description: 是否只读
- name: disabled
type: boolean
default: false
description: 是否禁用
slots:
- concept: Slot
name: default
description: 插入`<m-complex-item>`子组件。
events:
- name: before-select
description: 选择某一项前触发
params:
- name: $event.value
type: any
description: 选择项的值
- name: $event.oldValue
type: any
description: 旧的值
- name: $event.item
type: object
description: 选择项相关对象
- name: $event.itemVM
type: MComplexItem
description: 选择项子组件
- name: $event.preventDefault
type: Function
description: 阻止选择流程
- name: senderVM
type: MComplex
description: 发送事件实例
- name: input
description: 选择某一项时触发,仅在单选模式中生效
params:
- name: $event
type: any
description: 选择项的值
- name: senderVM
type: MComplex
description: 发送事件实例
- name: select
description: 选择某一项时触发。单选模式中:
params:
- name: $event.value
type: any
description: 改变后的值
- name: $event.oldValue
type: any
description: 旧的值
- name: $event.item
type: object
description: 选择项相关对象
- name: $event.oldItem
type: object
description: 旧的选择项相关对象
- name: $event.itemVM
type: MComplexItem
description: 选择项子组件
- name: $event.oldVM
type: MComplexItem
description: 旧的选择项子组件
- name: senderVM
type: MComplex
description: 发送事件实例
- name: select
description: 选择某一项时触发。多选模式中:
params:
- name: $event.selected
type: boolean
description: 选中还是取消
- name: $event.item
type: boolean
description: 该选中项相关对象
- name: $event.itemVM
type: boolean
description: 该选中项子组件
- name: $event.value
type: Array
description: 改变后的值
- name: $event.oldValue
type: Array
description: 旧的值
- name: $event.items
type: Array<object>
description: 所有选中项相关对象的数组
- name: $event.oldItems
type: Array<object>
description: 旧的所有选中项相关对象的数组
- name: $event.itemVMs
type: Array<MComplexItem>
description: 所有选中项子组件的数组
- name: $event.oldVMs
type: Array<MComplexItem>
description: 旧的所有选中项子组件的数组
- name: senderVM
type: MComplex
description: 发送事件实例
- name: change
description: 选择值改变时触发。单选模式中:
params:
- name: $event.value
type: any
description: 选择项的值
- name: $event.oldValue
type: any
description: 旧的值
- name: $event.item
type: object
description: 选择项相关对象
- name: $event.oldItem
type: object
description: 旧的选择项相关对象
- name: $event.itemVM
type: MComplexItem
description: 选择项子组件
- name: $event.oldVM
type: MComplexItem
description: 旧的选择项子组件
- name: senderVM
type: MComplex
description: 发送事件实例
- name: change
description: 选择值改变时触发。多选模式中:
params:
- name: $event.value
type: Array
description: 所有选中项的值
- name: $event.items
type: Array<object>
description: 所有选中项相关对象的数组
- name: $event.itemVMs
type: Array<MComplexItem>
description: 所有选中项子组件的数组
- name: senderVM
type: MComplex
description: 发送事件实例
- name: m-complex-item
extends: m-singlex-item, m-multiplex-item
attrs:
- name: text
title: 文本
type: string
description: 文本内容
- name: value
type: any
default: null
description: 此项的值
- name: selected
type: boolean
default: false
description: 是否选中此项
- name: disabled
type: boolean
default: false
description: 禁用此项
- name: item
type: object
default: null
description: 相关对象。当选择此项时,抛出的事件会传递该对象,便于开发
events:
- name: click
description: 点击此项时触发,与原生 click 事件不同的是,它只会在非只读和禁用的情况下触发。
params:
- name: $event
type: MouseEvent
description: 鼠标事件对象
- name: senderVM
type: MComplexItem
description: 发送事件实例
- name: before-select
description: 选择此项前触发
params:
- name: $event.value
type: any
description: 此项的值
- name: $event.item
type: object
description: 此项的相关对象
- name: $event.itemVM
type: MComplexItem
description: 此组件
- name: $event.preventDefault
type: Function
description: 阻止选择流程
- name: senderVM
type: MComplexItem
description: 发送事件实例