全局配置

使用 ViewUI(iView)时,可以进行全局配置组件的一些属性。

组件会优先使用 prop 设置的属性,如果未设置,再使用全局配置。

  • transfer:所有带浮层的组件,是否将浮层放置在 body 内,默认为不设置,详见各组件默认的 transfer 值。可选值为 truefalse
  • size:所有带有 size 属性的组件的尺寸,默认为不设置,详见各组件默认的 size 值。可选值为 defaultsmalllarge
  • 4.0.0 capture:所有带下拉的组件是否开启 capture 模式,默认为 true。可选值为 truefalse

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 属性

用法如下:

  1. Vue.use(ViewUI, {
  2. transfer: true,
  3. size: 'large',
  4. capture: false,
  5. select: {
  6. arrow: 'md-arrow-dropdown',
  7. arrowSize: 20
  8. }
  9. });