iView 是一套基于Vue.js的开源UI组件库，主要服务于PC界面的中后台产品。
1、iView的特性
1) 高质量、功能丰富
2) 友好的API ，自由灵活地使用空间
3) 细致、漂亮的 UI
4) 事无...
iView 是一套基于Vue.js的开源UI组件库，主要服务于PC界面的中后台产品。
1、iView的特性
1) 高质量、功能丰富
2) 友好的API ，自由灵活地使用空间
3) 细致、漂亮的 UI
4) 事无巨细的文档
5) 可自定义主题
2、iView的安装：
1) 使用npm：
npm install --save iview
2) CDN引入：
<link rel="stylesheet" href="css/iview.css">
<script src="js/iview.min.js"></script>
3、引入 iView
1) 一般在 webpack 入口页面 main.js 中如下配置：
import Vue from 'vue';
import VueRouter from 'vue-router';
import App from 'components/app.vue'; // 路由挂载
import Routers from './router.js'; // 路由列表
import iView from 'iview'; // 导入组件库
import 'iview/dist/styles/iview.css'; // 导入样式
Vue.use(VueRouter);
Vue.use(iView);
// 路由配置
const RouterConfig = {
routes: Routers
};
const router = new VueRouter(RouterConfig);
new Vue({
el: '#app',
router: router,
render: h => h(App)
});
2) 按需引用
在webpack中按需使用组件，可以减少文件体积：
import Input from 'iview/src/components/input';
注意：
① 按需引用仍需要导入样式，即在 main.js 或根组件执行 import 'iview/dist/styles/iview.css';
② 按需引用是直接引用的组件库源代码，需要借助 babel 进行编译，以 webpack 为例：
module: {
rules: [
{ test: /iview.src.*?js$/, loader: 'babel' },
{ test: /\.js$/, loader: 'babel', exclude: /node_modules/ }
]
}
3、组件使用规范
使用:prop传递数据格式为数字、布尔值或函数时，必须带:(即，使用v-bind)，它的值会被当做JavaScript表达式计算，否则会被当做字符串。
正确的使用方法：
<Page :current="1" :total="10"></Page>
错误的使用方法：
<Page current="1" total="10"></Page>
