iView配置

全局配置

使用 iView 3 时，可以进行全局配置组件的一些属性。

目前只支持配置 transfer 和 size 两个属性。组件会优先使用 prop 设置的属性，如果未设置，再使用全局配置。

• transfer：所有带浮层的组件，是否将浮层放置在 body 内，默认为不设置，详见各组件默认的 transfer 值。可选值为 true 或 false。放在body内的好处是在组件的父级标签设置了某些属性（比如overflow为hidden）时，不会导致浮层被裁切不显示
• size：所有带有 size 属性的组件的尺寸，默认为不设置，详见各组件默认的 size 值。可选值为 default、small 或 large。默认优先使用组件上设置的属性，未设置则用全局属性

Vue.use(iView, {
    transfer: true,
    size: 'large'
});

自定义主题配置

iView使用的是less进行的编译，设置修改iView主题样式的时候，我们需要安装less相关的配置

npm install less --save-dev
npm install less-loader --save-dev

• 在配置ivew的文件中将导入的样式先注释掉

import 'iview/dist/styles/iview.css'

• 创建一个新的new.less文件

/*引入系统的样式文件，再进行属性的修改覆盖从而改变主题颜色等配置*/
@import "~view/src/styles/index.less"
/*在index.less文件中有一个custom.less文件，其中系统主题颜色的属性名为@primary-color*/
@primary-color: #FF82AB
/*这样这个系统默认主题色就变为淡粉色了*/

• ivew.js中引入我们的这个新的less文件

// import 'iview/dist/styles/iview.css'
import '../new.less' // 新的less样式文件

iView Loader

统一iView标签的书写规范，所有标签都可以采用首字母大写的形式，包括Vue限制的两个标签Switch、Circle，同时，可以通过loader开启所有标签的前缀写法。i-date-picker

• 但由于Vue-CLI3对于Loader的支持不够，用CLI3创建的项目无法使用Loader，这里需要使用官方推荐的iView-project创建项目来使用Loader
• 在webpack.base.config.js中可以对Loader进行配置