【Vue】 UI组件库 - Mint UI - 简单使用 - Elment UI

最新推荐文章于 2024-06-21 01:02:08 发布
最新推荐文章于 2024-06-21 01:02:08 发布
阅读量985 收藏 4
点赞数
分类专栏： 前端框架Vue 文章标签： vue javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44972008/article/details/113921339
版权
本文介绍了Vue中两个常用的UI组件库——Mint UI和Element UI。Mint UI是饿了么为移动端开发的组件库，包括标签组件和非标签组件，而Element UI则面向PC端，提供了丰富的图形化界面组件。文中详细讲解了如何下载、按需打包Mint UI，以及安装、导入和使用Element UI的相关步骤。
摘要由CSDN通过智能技术生成

文章目录

1. 常用

1) Mint UI:

a. 主页: http://mint-ui.github.io/#!/zh-cn
b. 说明: 饿了么开源的基于vue 的移动端UI 组件库

2) Elment UI

a. 主页: http://element-cn.eleme.io/#/zh-CN
b. 说明: 饿了么开源的基于vue 的PC 端UI 组件库

2. 使用Mint UI

2.1. 下载:

npm install --save mint-ui

2.2. 实现按需打包

  1. 下载
npm install --save-dev babel-plugin-component
  1. 修改babel 配置
"plugins": ["transform-runtime",["component", [
{
   
"libraryName": "mint-ui",
"style": true
}
]]]

2.3. mint-ui 组件分类

  1. 标签组件
  2. 非标签组件

2.4. 使用mint-ui 的组件

1)index.html

<meta name
最低0.47元/天 解锁文章
YK菌
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue + element-ui实现简洁的导入导出功能
10-18
Element-UI是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,手机端有对应框架是 Mint UI，下面这篇文章主要给大家介绍了关于利用vue + element-ui如何实现简洁的导入导出功能的相关资料，需要的朋友可以...
浅谈在vue中使用mint-ui swipe遇到的问题
12-11
使用步骤： 1.安装：npm install mint-ui -S 2.引入组件 // 完整引入import Vue from 'vue'; import Mint from 'mint-ui'; import "mint-ui/lib/style.css" Vue.use(Mint); // 按需引入 注意：和Element-ui类似，按...
14 个最佳 Vue UI 组件库推荐
热门推荐
古他妈阳光之神☀️
08-24 2万+
Vue.js 是无数前端开发人员首选的 JavaScript 框架，因为它易于学习和使用。 组件是 Vue 框架的核心——它们可以帮助你更快地从想法转变为功能性 UI。
12个Vue UI 组件库
顺其自然~专栏
06-16 4799
Vue.js 是一个渐进式 javascript 框架，用于构建 UIS（用户界面）和 SPA（单页应用程序）。UI 组件库提高了我们的开发效率，增强了应用的整体外观、感觉、交互性和可访问性，下面就来看看有哪些适用于 Vue 的 UI 组件库。
前端：2024年非常受欢迎非常火的 VueUI 库
最新发布
一些平时在开发过程中遇到的常见问题，分享给大家
06-21 1976
前端：2024年非常受欢迎非常火的 VueUI 库
Vue----组件库
emmmm.....
04-27 4287
文章目录组件库1. 什么是 vue 组件库2. 最常用的 vue 组件库3. Element UI3.1 在 vue2 的项目中安装 element-ui3.2 引入 element-ui4. 把组件的导入和注册封装为独立的模块 组件库 1. 什么是 vue 组件库 在实际开发中，前端开发者可以把自己封装的 .vue 组件整理、打包、并发布为 npm 的包，从而供其他人下载和使用。 这种可以直接下载并在项目中使用的现成组件，就叫做 vue 组件库。 2. 最常用的 vue 组件库 PC 端 Ele
vue常用组件库
B13362260109的博客
07-20 797
Vue是主流的前端框架。
Vue常用组件库
qq_63254993的博客
04-22 169
移动端 Vant Vant 是一个轻量、可靠的移动端组件库。目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本 https://vant-contrib.gitee.io/vant/v2/#/zh-CN/col Cube UI 滴滴出行移动端 UI 库 https://didi.github.io/cube-ui/#/zh-CN VUX 移动端 UI 组件库，针对微信强势优化 https://vux.li/ NuTUI 3.0 京东风格的轻量级移动端组件库 https://nu
mint-ui-learn：从element学习vue组件
02-06
《从Element学习Vue组件——深度探索mint-ui-learn》 Vue.js作为一个强大的前端框架，其丰富的组件库是其一大亮点。Element UI就是其中备受推崇的一个，它提供了许多实用且美观的UI组件，使得开发者能够快速构建出...
element-ui 限制日期选择的方法(datepicker)
08-27
Element-UI 是饿了么前端团队推出的基于 Vue.js 2.0 的桌面端 UI 框架，手机端有对应框架是 Mint UI。本篇文章主要介绍了 Element-UI 中日期选择器的限制日期选择的方法。 在实际应用中，我们经常需要限制日期选择...
nuxt.js+mint-ui :省/市/区三级联动
11-01
Mint-UI是基于Vue.js的移动端UI组件库，提供了丰富的组件，如按钮、表单、加载提示、下拉菜单等，帮助开发者快速构建美观的移动应用。在本项目中，我们将用到它的级联选择器（Cascader）组件来实现省市区的三级联动...
Vue常用组件库的比较分析（pc端）
chenzimin_blog
04-30 9254
Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。 Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习，非常容易与其它库或已有项目整合。另一方面，在与相关工具和支持库一起使用时，Vue.js 能完美地驱动复杂的单页应用。 本篇文章就是对pc端的各大组件库进行分析比较 ，以便根据实际情况选择自己需要的组件库，包括pc端和移动端。
Mint-ui(移动组件库) Element-ui
ice-bear
12-04 1686
Mint-ui(移动组件库) Element-ui
Mint UI - 饿了么出品的开源、轻量的移动端 UI 组件库
那些免费的砖
03-02 4959
一款轻量化的移动端 UI 组件库，风格中性，css3动效性能优秀，支持按需加载。 关于 Mint UI Mint UI 是饿了么前端团队出品的移动端 UI 组件库，基于 Vue 2.0 构建，继桌面 UI 组件库 Element UI 后又一个优秀的开源 UI 组件库，包含丰富的 CSS 和 JS 组件，能够快速构建出风格统一的页面，提升开发效率。 Mint UI 组件库特性 UI 设计风格中性，不需要改样式就能适应很多产品项目 轻量化。依托 Vue.js 高效的组件化方案，Mint UI 做到了轻量化.
ElementUI基础组件
NPC111的博客
03-18 2132
简介ElementUI是基于Vue封装的UI框架，提供了大量可以直接使用的标签和样式效果。
elememt ui 组件 dialog使用备忘
dingwen
08-15 203
文章目录1. 多层嵌套dialog遮罩1.1 描述1.2 解决（子dialog中）2. 鼠标移除dialog点击不关闭 1. 多层嵌套dialog遮罩 1.1 描述 当有多层dialog嵌套时，弹出新层dialog会出现灰色遮罩的问题。 1.2 解决（子dialog中） <el-dialog append-to-body> 　　<div>内容</div> </el-dialog> 2. 鼠标移除dialog点击不关闭 <el-dialog :vi
基于mint-ui的移动应用开发案例四（应用中心）
weixin_30378311的博客
11-30 566
本节主要包括以下内容：应用中心界面的布局mt-swipe，loadmore，mt-cell，mt-actionsheet等组件的使用echarts的使用1.应用中心界面的布局页面的大体结构是一个头标题，走马灯的图片展示区域，和下面的子应用的icon展示。<template> <div id="tool"> <!--头部--...
vue中使用mint-ui
qq_37872208的博客
12-13 525
在vue项目中安装使用Mint-UI的方法 Mint UI 是 由饿了么前端团队推出的 一个基于 Vue.js 的移动端组件库,下面通过本文给大家介绍在vue项目中安装使用Mint-UI的方法，需要的朋友参考下吧 一、Mint UI 是 由饿了么前端团队推出的 一个基于 Vue.js 的移动端组件库,具有以下特性: 使用文档： http://mint-ui.github.io/#!/zh...
vue-cli3 使用mint-ui
m0_37115637的博客
05-10 1521
按需引入 借助 babel-plugin-component，我们可以只引入需要的组件，以达到减小项目体积的目的。 首先，安装 babel-plugin-component： npm install babel-plugin-component -D 然后，将 babel.config.js修改为： module.exports = { presets: ["@vue/app"], ...
Vue影院开发实践：基于VueCli+Element-Ui的猫眼App克隆
在这个项目中，开发者利用Vue CLI作为脚手架搭建项目，Vue Router用于管理页面路由，Vuex作为状态管理工具，Element-UI提供了丰富的组件库支持PC端界面设计，而Mint-UI则用于优化移动端的用户体验。axios作为一个...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值