iviewui php,vue中iView是什么?

在vue中,iView是一套基于Vue.js的开源UI组件库,主要服务于PC界面的中后台产品。iView提供丰富的组件和功能,可满足绝大部分网站场景;提供开箱即用的Admin系统和高阶组件库,极大程度节省开发成本。

bb3c69ea6532e6402ad56422b0ea7dee.png

iView 是一套基于 Vue.js 的开源 UI 组件库,主要服务于 PC 界面的中后台产品。使用单文件的 Vue 组件化开发模式,基于 npm + webpack + babel 开发,支持 ES2015 高质量、功能丰富 友好的 API ,自由灵活地使用空间,由TalkingData开发维护,有很多知名互联网企业都在使用。

官网地址:https://www.iviewui.com/

iView的特性丰富的组件和功能,满足绝大部分网站场景

提供开箱即用的 Admin 系统 和 高阶组件库,极大程度节省开发成本

提供专业、优质的一对一技术支持

友好的 API ,自由灵活地使用空间

细致、漂亮的 UI

事无巨细的文档

可自定义主题

iView的安装:

1) 使用npm:npm install --save iview

2) CDN引入:

引入 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/ }

]

}

组件使用规范

使用:prop传递数据格式为数字、布尔值或函数时,必须带:(即,使用v-bind),它的值会被当做JavaScript表达式计算,否则会被当做字符串。

正确的使用方法:

错误的使用方法:

更多编程相关知识,请访问:编程视频课程!!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值