全局配置
使用 ViewUI(iView)时,可以进行全局配置组件的一些属性。
组件会优先使用 prop 设置的属性,如果未设置,再使用全局配置。
- transfer:所有带浮层的组件,是否将浮层放置在 body 内,默认为不设置,详见各组件默认的 transfer 值。可选值为
true
或false
。 - size:所有带有 size 属性的组件的尺寸,默认为不设置,详见各组件默认的 size 值。可选值为
default
、small
或large
。 - 4.0.0 capture:所有带下拉的组件是否开启 capture 模式,默认为 true。可选值为
true
或false
。
capture 是浏览器的一种默认行为,如果开启,当可下拉的组件(例如 Select)处于展开状态时,点击外部操作不会立即响应,而是先收起下拉菜单,再次点击才会响应操作。
如果不需要该特性,可以通过全局配置,将 capture 设置为 false。
- select.arrow:Select 下拉箭头图标
- select.customArrow:Select 自定义下拉箭头图标
- select.arrowSize:Select 下拉箭头尺寸
- cell.arrow:Cell 右侧箭头图标
- cell.customArrow:Cell 自定义右侧箭头图标
- cell.arrowSize:Cell 右侧箭头尺寸
- menu.arrow:Menu 下拉箭头图标
- menu.customArrow:Menu 自定义下拉箭头图标
- menu.arrowSize:Menu 下拉箭头尺寸
- tree.arrow:Tree 下拉箭头图标
- tree.customArrow:Tree 自定义下拉箭头图标
- tree.arrowSize:Tree 下拉箭头尺寸
- cascader.arrow:Cascader 下拉箭头图标
- cascader.customArrow:Cascader 自定义下拉箭头图标
- cascader.arrowSize:Cascader 下拉箭头尺寸
- cascader.itemArrow:Cascader 右侧箭头图标
- cascader.customItemArrow:Cascader 自定义右侧箭头图标
- cascader.itemArrowSize:Cascader 右侧箭头尺寸
- colorPicker.arrow:ColorPicker 下拉箭头图标
- colorPicker.customArrow:ColorPicker 自定义下拉箭头图标
- colorPicker.arrowSize:ColorPicker 下拉箭头尺寸
- datePicker.icon:DatePicker 日期图标
- datePicker.customIcon:DatePicker 自定义日期图标
- datePicker.iconSize:DatePicker 日期图标尺寸
- timePicker.icon:TimePicker 时间图标
- timePicker.customIcon:TimePicker 自定义时间图标
- timePicker.iconSize:TimePicker 时间图标尺寸
- tabs.closeIcon:Tabs 关闭图标
- tabs.customCloseIcon:Tabs 自定义关闭图标
- tabs.closeIconSize:Tabs 关闭图标尺寸
- modal.maskClosable:Modal 的 maskClosable 属性
用法如下:
Vue.use(ViewUI, {
transfer: true,
size: 'large',
capture: false,
select: {
arrow: 'md-arrow-dropdown',
arrowSize: 20
}
});