vue移动端ui框架

文章/答案/技术大牛

发布

自从Vue成为前端的主流框架之后，各家UI框架也越来越多，今天重点聊一聊移动端的那些框架吧，Vue移动端框架到底哪家强？以下排名不分先后，开发过程中根据自己的具体业务需求来做选择。...x-page=v2-doc-home#/ VUX 是基于 WeUI 和 Vue.js 的移动端 UI 组件库,提供丰富的组件满足移动端(微信)页面常用业务需求，可以说是相当的全面了。 ?...://elemefe.github.io/mint-ui/#/ 饿了么前端团队推出的 Mint UI 是一个基于 Vue.js 的移动端组件库，包含丰富的 CSS 和 JS 组件，能够满足日常的移动端开发需要...#/ 在线预览：https://wangdahoo.github.io/vonic/docs/#/home 一个基于 vue.js 和 ionic 样式的 UI 框架，用于快速构建移动端单页应用.../quick-start cube-ui 是滴滴17年底开源的一款基于 Vue.js 2.0 的移动端组件库，主要核心目标是做到体验极致、灵活性强、易扩展以及提供良好的周边生态—后编译。

3.7K2 0

Vue PC端框架和Vue移动端UI框架

在学习Vue的过程之中，我发现不管是 BAT 大厂，还是创业公司，Vue 都有着广泛的应用，而且框架层出不穷，学习文档也越来越多，Vue也越来越受欢迎。...下面是我整理的 Vue PC端和移动端的UI框架，建议收藏，方便以后学习的时候拿出来查看。 Vue PC端框架 1....vue-element-admin 4....VueStrap 在线文档：http://yuche.github.io/vue-strap/ github地址：https://github.com/yuche/vue-strap 6..../Keen-UI Vue移动端UI框架 1.Vux 中文文档：https://vux.li/#/ 在线预览：https://vux.li/demos/v2/?

2.9K4 0

您找到你想要的搜索结果了吗？

是的

没有找到

Vue移动端框架Mint UI教程-搭建环境引入框架（一）

今天具体说一说比较常用的；Mint UI框架的按钮组件，Mint UI是饿了么团队开发基于vue .js的移动端UI框架，它包含丰富的 CSS 和 JS 组件，能够满足日常的移动端开发需要。...官网：https://mint-ui.github.io/#!/zh-cn Github: https://github.com/ElemeFE/mint-ui/ ---- ?...1：安装node 端开发框架和环境都是需要 Node.js ，先安装node.js开发环境，vue的运行是要依赖于node的npm的管理工具来实现，下载https://nodejs.org/en/，安装完成之后...6：安装 Mint UI npm install mint-ui -S 快捷键ctrl+c,终止批处理操作吗(Y/N)，从上一步退出来，再输入命令npm install mint-ui -S 成功安装组件显示如下...7：然后在项目中的main.js文件引入所有组件 // 引入全部组件 import Vue from 'vue'; import Mint from 'mint-ui'; Vue.use(Mint

3.4K2 0

Vue移动端框架Mint UI教程-搭建环境引入框架（一）

今天具体说一说比较常用的；Mint UI框架的按钮组件，Mint UI是饿了么团队开发基于vue .js的移动端UI框架，它包含丰富的 CSS 和 JS 组件，能够满足日常的移动端开发需要。.../zh-cn Github: https://github.com/ElemeFE/mint-ui/ 1：安装node 端开发框架和环境都是需要 Node.js ，先安装node.js开发环境，vue...Mint UI；准备好好之后，开始引入饿了么Mint UI组件。...mint-ui -S 成功安装组件显示如下 7：然后在项目中的main.js文件引入所有组件 // 引入全部组件 import Vue from 'vue'; import Mint from...'mint-ui'; Vue.use(Mint); 8：在App.vue中写代码 <mt-button @click.native="handleClick

5151 0

Vue 移动端框架

1. vonic vonic 一个基于 vue.js 和 ionic 样式的 UI 框架，用于快速构建移动端单页应用，很简约。中文文档 | github地址 | 在线预览 ?...vonic 2. vux vux 基于WeUI和Vue(2.x)开发的移动端UI组件库。...Mint UI Mint UI 由饿了么前端团队推出的 Mint UI 是一个基于 Vue.js 的移动端组件库。中文文档 | github地址 | 在线预览 ? Mint UI 4....Cube-UI 滴滴 WebApp 团队实现的基于 Vue.js 实现的精致移动端组件库中文文档 | github地址 | 在线预览 ?...Onsen UI 相关文章 Vue PC端框架别走，还有后续呐······ 如果小伙伴们有比较好的移动端框架，欢迎在评论区留言砸场，谢谢你的贡献。

4.2K3 0

Vue PC端UI框架

Element Element，一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库中文文档 | github地址 2. iView 一套基于 Vue.js 的高质量UI 组件库...Vuetify Vuetify是一个渐进式的框架，试图推动前端开发发展到一个新的水平。...Vue Beauty 基于 ant design 的漂亮的 vue 组件库；vue-beauty 是一套基于 vue.js 和 ant-design样式的PC端 UI 组件库，旨在帮助开发者提升产品体验和开发效率...Vue-Blu Vue-Blu是基于Vuejs和Bulma开发的开源UI组件库。旨在为PC端的前端开发(特别是中后台产品)提供一个快速且灵活的解决方案。中文文档 | github地址 16....Quasar Quasar（发音为/kweɪ.zɑɹ/)是MIT许可的开源框架（基于Vue），允许开发人员编写一次代码，然后使用相同的代码库同时部署为网站、PWA、Mobile App和Electron

3.1K2 0

Vue移动端框架Mint UI教程-底部导航栏（二）

---- 官网：https://mint-ui.github.io/#!...，正好今天要聚餐，趁着下午的时间，把之前没有写完的Mint UI教程继续写一写。...接着上一篇：Vue移动端框架Mint UI教程-搭建环境引入框架（一）：https://www.jianshu.com/p/874e5152b3c5 开始来写代码： 1：在components里面新建一个.../router' import Mint from 'mint-ui' import 'mint-ui/lib/style.css' Vue.config.productionTip = false...github链接：https://github.com/wangxiaoting666/Mint-UI

2.9K2 0

Vue移动端框架Mint UI教程-组件的使用（三）

---- 官网：https://mint-ui.github.io/#!.../zh-cn Github: https://github.com/ElemeFE/mint-ui/ ---- 前面两节说到，从搭建环境，引入Mint框架，到实现一个页面导航跳转； Vue移动端框架...Mint UI教程-搭建环境引入框架（一）：https://www.jianshu.com/p/874e5152b3c5 Vue移动端框架Mint UI教程-底部导航栏（二）：https://www.jianshu.com.../p/56e887cbb660 然后就是开始写每个页面的代码，Mint UI存在必有道理基于vue2.0mint-ui组件的使用 ?... import { Toast } from 'mint-ui

2K3 0

Vue移动端框架Mint UI教程-底部导航栏（二）

官网：https://mint-ui.github.io/#!.../zh-cn Github: https://github.com/ElemeFE/mint-ui/ 最近一个月的时间，工作上的事情特别多，要同时开发维护三四个项目，让人觉得有些憔悴，也没有时间去学习了...，正好今天要聚餐，趁着下午的时间，把之前没有写完的Mint UI教程继续写一写。...接着上一篇：Vue移动端框架Mint UI教程-搭建环境引入框架（一）：https://www.jianshu.com/p/874e5152b3c5 开始来写代码： 1：在components里面新建一个.../router' import Mint from 'mint-ui' import 'mint-ui/lib/style.css' Vue.config.productionTip = false

5040 0

Vue移动端框架Mint UI教程-接口跨域问题

自己写了一个json数据，放在服务器上，现在要通过vue项目调用数据 http://www.intmote.com/test.json 我现在要调用在调用接口数据的时候的时候会出现这样的报错...json接口写在请求里图片.png 解决办法：设置代理，利用proxyTable属性实现跨域请求 1：打开build/webpack.dev.conf.js，配置代理proxyTable属性如下：通过vue-cli...changeOrigin: true, pathRewrite: { '^/api': '' } } }, 图片.png 2：回到当前页面,我的页面是my.vue

9742 1

Vue移动端框架Mint UI教程-组件的使用（三）

官网：https://mint-ui.github.io/#!.../zh-cn Github: https://github.com/ElemeFE/mint-ui/ 前面两节说到，从搭建环境，引入Mint框架，到实现一个页面导航跳转； Vue移动端框架Mint UI...教程-搭建环境引入框架（一）：https://www.jianshu.com/p/874e5152b3c5 Vue移动端框架Mint UI教程-底部导航栏（二）：https://www.jianshu.com.../p/56e887cbb660 然后就是开始写每个页面的代码，Mint UI存在必有道理基于vue2.0mint-ui组件的使用 import { Toast } from 'mint-ui

5070 0

Vue移动端框架Mint UI教程-跳转新页面(四)

前三节写了vue的移动端框架的入门篇章，今天接着写，今天写的教程其实很简单，在之前的基础上，新建一个界面，并且进行跳转新页面。 ---- 官网：https://mint-ui.github.io/#!.../zh-cn Github: https://github.com/ElemeFE/mint-ui/ ---- Vue移动端框架Mint UI教程-搭建环境引入框架（一） https://www.jianshu.com.../p/874e5152b3c5 Vue移动端框架Mint UI教程-底部导航栏（二） https://www.jianshu.com/p/56e887cbb660 Vue移动端框架Mint UI教程-...组件的使用（三） https://www.jianshu.com/p/5ec1e2d2f652 1：首先，在pages底下新建一个新的页面fa.vue ?.../pages/fa.vue' { path: '/fa', component: Fa } ?

2.4K3 0

Vue移动端框架Mint UI教程-数据渲染到页面（六）

1：接上一节，打开my.vue界面，编写代码拿到res.data之后，要赋值给page实例里面的data 所以在data里面设置一个默认的空数组 2：响应正确的时候回调，把数据存放到data中 3：

2870 0

Vue移动端框架Mint UI教程-接口跨域问题（七）

自己写了一个json数据，放在服务器上，现在要通过vue项目调用数据 http://www.intmote.com/test.json ?...图片.png 解决办法：设置代理，利用proxyTable属性实现跨域请求 1：打开build/webpack.dev.conf.js，配置代理proxyTable属性如下：通过vue-cli提供给的代理...图片.png 2：回到当前页面,我的页面是my.vue,修改请求路径 created() { this.

1.7K3 0

Vue移动端框架Mint UI教程-数据渲染到页面（六）

1：接上一节，打开my.vue界面，编写代码 ? 拿到res.data之后，要赋值给page实例里面的data 所以在data里面设置一个默认的空数组 ?

1.3K4 0

Vue移动端框架Mint UI教程-调用模拟json数据(五)

1：安装 npm install vue-resource ? ?...2：打开main.js 注册 import VueResource from 'vue-resource' Vue.use(VueResource) ? 3：在项目里面创建一个json文件 ?...9：在浏览器里面输入http://localhost:8080 打开项目注意8080端口要和my.vue里面打印的端口保持一致调出控制台，可以看见，接口数据已经显示在控制台了 ?

1.4K5 0

Vue：移动端 UI 如何做适配？

导语 | 移动端做 UI 适配其实很简单。这里仅指手机端，iPad 及 PC 端需要另做打算。目录三类法三规则为什么选择 iPhone6 做基准本文大约 1000 字，阅读 5 分钟。...iPhone 仅手机端就有这么多尺寸： ? 每种尺寸都要单独做一套 UI 及样式吗，显然不现实。合理的做法是将设备尺寸分为三类，只处理三类尺寸。Android 适配亦是如此。 ?

2K2 0

Varlet UI-Material Design风格Vue 3框架移动端组件库

#Varlet UI是什么在现代Web开发中，Vue 3以其强大的组件系统特性，成为了构建可复用、模块化应用界面的首选框架。...Varlet UI 一个 Vue3 组件库，基于 Material Design 2 和 3，支持移动端、桌面端。...##介绍Varlet 是一个 Vue3 组件库，基于 Material Design 2 和 3，支持移动端、桌面端，由 varletjs 组织维护。...简介Varlet UI是一个基于Vue 3框架开发的移动端组件库，采用了流行的Material Design风格。...名称描述vue-h5-template基于 Vue 的移动端模板脚手架，提供了 Varlet 组件库的移动端预设create-vite-app基于 Vue3 的桌面端模板脚手架，提供了 Varlet 组件库的桌面端预设

1.3K0 0

vue UI 框架

（1）Element 饿了么 vue 2.0后台UI框架 (Star:18382) https.../roadmap （2）iview组件库 (Star:10186) 　　 iView 主要服务于 PC 界面的中后台业务，很优秀的组件库，可惜不适合移动端　　 https://github.com/iview.../iview https://iviewui.com/ （3）vux 基于Vue和WeUI的移动UI组件 (Star:9762) Vux是基于WeUI和Vue(2.x)开发的移动端UI...https://github.com/airyland/vux https://vux.li/ （4）Mint-UI 饿了么移动端组件库 (Star:8062) 　　由饿了么前端团队推出的 Mint...UI 是一个基于 Vue.js 的移动端组件库 https://github.com/ElemeFE/mint-ui （5）vue-admin 管理面板UI框架 (Star:6289) https:

1.8K2 0

vue:将px转化为rem，适配移动端vant-UI等框架(postcss-pxtorem)

1.下载lib-flexible 使用的是vue-cli+webpack，通过npm来安装的 npm i lib-flexible --save 2.引入lib-flexible 在main.js中引入...之所以设为37.5，是为了引用像vant、mint-ui这样的第三方UI框架，因为第三方框架没有兼容rem，用的是px单位，将rootValue的值设置为设计图宽度（这里为750px）75的一半，即可以...1:1还原vant、mint-ui的组件，否则会样式会有变化，例如按钮会变小。...6.当配置完之后，只需要重启下服务，就自动转化为rem了 npm run dev 拓展 px转rem不仅可以用postcss-pxtorem，同时还有px2rem-loader，只是配置不一样； vue...：将px转化为rem，适配移动端vant-UI等框架（px2rem-loader）

2K3 0

点击加载更多

Vue移动端UI框架

Vue PC端框架和Vue移动端UI框架

Vue移动端框架Mint UI教程-搭建环境引入框架（一）

Vue移动端框架Mint UI教程-搭建环境引入框架（一）

Vue 移动端框架

Vue PC端UI框架

Vue移动端框架Mint UI教程-底部导航栏（二）

Vue移动端框架Mint UI教程-组件的使用（三）

Vue移动端框架Mint UI教程-底部导航栏（二）

Vue移动端框架Mint UI教程-接口跨域问题

Vue移动端框架Mint UI教程-组件的使用（三）

Vue移动端框架Mint UI教程-跳转新页面(四)

Vue移动端框架Mint UI教程-数据渲染到页面（六）

Vue移动端框架Mint UI教程-接口跨域问题（七）

Vue移动端框架Mint UI教程-数据渲染到页面（六）

Vue移动端框架Mint UI教程-调用模拟json数据(五)

Vue：移动端 UI 如何做适配？

Varlet UI-Material Design风格Vue 3框架移动端组件库

vue UI 框架

vue:将px转化为rem，适配移动端vant-UI等框架(postcss-pxtorem)

相关资讯

热门标签

活动推荐

运营活动

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐