Vue----组件库
文章目录
- 组件库
- 1. 什么是 vue 组件库
- 2. 最常用的 vue 组件库
- 3. Element UI
- 3.1 在 vue2 的项目中安装 element-ui
- 3.2 引入 element-ui
- 4. 把组件的导入和注册封装为独立的模块
组件库
1. 什么是 vue 组件库
在实际开发中,前端开发者可以把自己封装的 .vue 组件整理、打包、并发布为 npm 的包,从而供其他人下载和使用。
这种可以直接下载并在项目中使用的现成组件,就叫做 vue 组件库。
2. 最常用的 vue 组件库
- PC 端
Element UI
View UI - 移动端
Mint UI
Vant
(以 Element UI 为例)
3. Element UI
Element UI 是饿了么前端团队开源的一套 PC 端 vue 组件库。支持在 vue2 和 vue3 的项目中使用:
vue2 的项目使用旧版的 Element UI
vue3 的项目使用新版的 Element Plus
3.1 在 vue2 的项目中安装 element-ui
npm i element-ui -S
3.2 引入 element-ui
开发者可以一次性完整引入所有的 element-ui 组件,或是根据需求,只按需引入用到的 element-ui 组件:
完整引入:操作简单,但是会额外引入一些用不到的组件,导致项目体积过大
按需引入:操作相对复杂一些,但是只会引入用到的组件,能起到优化项目体积的目的
(Vue3 网页进不去,以Vue2为例)
引入 element-ui
4. 把组件的导入和注册封装为独立的模块
在 src 目录下新建 element-ui/index.js 模块。
import Vue from 'vue'
// 按需导入element-ui组件
import { Button, Input } from 'element-ui'// 注册需要的组件
Vue.use(Button)
Vue.use(Input)
在main.js中导入
import './element/index.js'
Vue----组件库相关推荐
- 使用vue加svg实现流程图代码_京东风格的移动端Vue组件库NutUI2.0来啦
移动端 Vue 组件库 NutUI 自发布以来受到了广泛的关注.据不完全统计,目前至少有30多个京东的 web 项目正在使用 NutUI . 经过一段时间紧锣密鼓的开发,近期,京东正式发布了 NutU ...
- 京东Vue组件库NutUI 2.0发布:将支持跨平台!
NutUI 是一套来自京东用户体验设计部(JDC)前端开发部的移动端 Vue 组件库,NutUI 1.0 版本于 2018 年发布.据不完全统计,目前在京东至少有30多个 web 项目正在使用 Nut ...
- 不厌其烦,又一个Vue组件库
Github仓库地址: github.com/ms-design/m- 文档和Demo网站: ms-design.github.io MS Design 基于微软 Fluent Design 设计的 ...
- vue 组件库发布_如何创建和发布Vue组件库
vue 组件库发布 Component libraries are all the rage these days. They make it easy to maintain a consisten ...
- Vant 1.0 发布:轻量、可靠的移动端 Vue 组件库
Vant 是有赞前端团队维护的移动端 Vue 组件库,提供了一整套 UI 基础组件和业务组件.通过 Vant 可以快速搭建出风格统一的页面,提升开发效率. Vant 一.关于 1.0 距离 Vant ...
- Antd Vue 组件库之Table表单
Antd Vue 组件库之Table表单 Table 表格 展示行列数据. 何时使用 当有大量结构化的数据需要展现时: 当需要对数据进行排序.搜索.分页.自定义操作等复杂行为时. 如何使用 指定表格的 ...
- 十多款优秀的Vue组件库介绍
十多款优秀的Vue组件库介绍 1. iView UI组件库 iView 是一套基于 Vue.js 的开源 UI 组件库,主要服务于 PC 界面的中后台产品.iView的组件还是比较齐全的,更新也很快, ...
- GitChat · 前端 | Vue 组件库实践和设计
来自 GitChat 作者:周志祥 更多IT技术分享,尽在微信公众号:GitChat技术杂谈 前言 现在前端的快速发展,已经让组件这个模式变的格外重要.对于市面上的组件库,虽然能满足大部分的项目,但是 ...
- Vant - 高效的 Vue 组件库,再造一个有赞移动商城也不在话下
Vant ( \ˈvænt\ ) 是有赞前端团队基于有赞统一的规范实现的 Vue 组件库,提供了一整套 UI 基础组件和业务组件.通过 Vant,可以快速搭建出风格统一的页面,提升开发效率.目前已有近 ...
- vue组件库大全(忘了的时候可以进来找一下~)
基于Vue的组件库 https://github.com/ElemeFE/element" element 饿了么出品的Vue2的web UI工具套件 https://github.com/ ...
最新文章
- pd.dataframe.append
- 识别网络应用所使用的协议Amap
- 图解MySQL删除再安装教程
- php中id如何与删除关联,ThinkPHP查询语句与关联查询用法实例
- 联想集团委任杨澜为独立董事:任期三年年薪235万元
- 如果编程语言是女孩,你最喜欢哪一个?
- 关于asp.net C# 导出Excel文件 打开Excel文件格式与扩展名指定格式不一致的解决办法...
- python 主线程_Python 主线程捕获子线程异常
- [转帖]达梦数据库(DM6)和ORACLE 10g的异同点
- img 图片加载出错时 显示默认图片
- copy和strong的区别
- 为什么定积分可以求面积?
- 使用MapReduce实现k-means算法
- 费马小定理(详细证明)
- 为什么程序员喜欢在半夜写代码?
- leetcode系列】【面试题】【中等】数组中数字出现的次数(位运算、二分)
- TensorFlow2 手把手教你实现自定义层
- 使用Python处理百万数据量的Excel文件:删除列、切分换行、替换去重
- Kepware读取研华ADAM4017总结
- ZipArchive打开文件时的错误代码