Material Design 组件框架

Vuetify 是一个 Vue UI 库,包含手工制作的精美材料组件。不需要设计技能 - 创建令人惊叹的应用程序所需的一切都触手可及。

为什么使用 Vuetify?

用 Vue 构建应用程序从未如此简单。使用成功所需的所有工具来加速您的开发过程。

Vue Framework Comparison 2020
Features

Vuetify

BootstrapVue

Buefy

Element UI

Quasar Framework

Full Accessibility and Section 508 support          
Server Side Rendering support          
Long-term Support          
Release cadence** Weekly Bi-Weekly Bi-Monthly Bi-Weekly Bi-Weekly
Treeshaking Automatic Manual Manual Manual Automatic
RTL support          
Premium Themes          
Business and Enterprise support        

用 Vue + Vuetify 这一套框架写了个 仓库管理系统 和 个人网站,所以整理了如何用 Vue,Vuetify,Vuex,Vue-router 写一个单页应用 (SPA),为以后回忆方便,也供初学者参考,少踩坑。

(这篇不是 Vue 的基础介绍,所以建议先读了 Vue 的官方文档,再来看怎么应用。)

这篇以开发的个人网站为例,从一个空文件夹开始讲到完整个网站,其中包括这几个模块:

配置开发环境
配置 Webpack
将 Vuex + Vue-router + Vue-router-sync + Vuetify 整合到整个

为什么使用 Vuetify?相关推荐

  1. vuetify table_vuex 封装设计全局可用的vuetify中的snackbar

    Vuetify是 Vue 的一个UI框架,帮助我们快速搭建应用.有众多优秀的组件可供选择: v-data-table 显示表格数据 v-dialog 实现弹框设计 v-toolbar等实现横向菜单 . ...

  2. NUXT快速开始,选择Vuetify

    安装 Nuxt.js 十分简单易用.一个简单的项目只需将 nuxt 添加为依赖组件即可. Nuxt.js 基础知识 了解如何在视频中快速使用Nuxt.js 由VueSchool制作视频课程,用于支持N ...

  3. vuetify electron (开发环境及打包)

    1.安装node 2.安装vue/cli $ npm install @vue/cli -g 3.创建应用并进入应用目录$ vue create my-app$ cd my-app 4.添加elect ...

  4. vuex构建vue项目_如何使用Vue.js,Vuex,Vuetify和Firebase构建单页应用程序

    vuex构建vue项目 如何使用Vuetify和Vue路由器安装Vue并构建SPA (How to install Vue and build an SPA using Vuetify and Vue ...

  5. 从0到1使用VUE-CLI3开发实战(五):模块化VUEX及使用vuetify

    小肆前几天发了一篇2019年Vue精品开源项目库的汇总,今天小肆要使用的是在UI组件中排行第三的Vuetify. vuetify介绍 Vuetify是一个渐进式的框架,完全根据Material Des ...

  6. vb6.0 listview隐藏水平方向滚动条_为Vuetify的UI组件添加滚动条

    前言 有必要说明,这其实是一个很简单的功能,用原生实现也非常简单: #preview-zone {overflow-y: auto;overflow-x: hidden;height: 90%;wid ...

  7. vuetify中文文档_我们为什么选择Vuetify作为前端框架

    尝试了很多不同的前端框架,最终我们选择Vuetify(https://vuetifyjs.com)前端框架. 从Bootstrap开始,到iview,Buefy,elementUI,我们都是不断的尝试 ...

  8. vuetify 学习第一天之v-data-table_表格组件

    v-data-table组件学习第一天 目录 文章目录 1.简介 2.常用属性 2.1.常用属性 2.2.详细描述 2.2.1.headers详解 2.2.2.items 2.2.3 .options ...

  9. 第一天之导入Vuetify的坑

    Webpack导入Vuetify的坑 对于一般的官网创建来说是这样的: $ vue create day01 // navigate to new project directory $ cd day ...

最新文章

  1. python开发需要掌握哪些知识-学习Python应该掌握哪些知识点?
  2. HTML5 Shiv #8211; 让该死的IE系列支持HTML5吧
  3. iOS设计模式——委托(delegate)
  4. 判断文件夹存在_Excel VBA之FSO-2.3文件夹的移动
  5. 每日三道前端面试题--vue 第五弹
  6. java 集合 总结 表_java-集合总结
  7. GSON简单实用及常用方法(附 .jar 地址)
  8. resourcehacker汉化版教程
  9. FICO配置详解之三:固定资产会计配置
  10. java堆的特点_java栈的特点是什么?java的堆和栈的优缺点介绍
  11. Sentinel2 哨兵2数据下载方法(USGS)-史上最全讲解
  12. php图片颤抖,PHP-使用jquery 怎么做出图片的震荡效果
  13. 咦?智能颈部按摩仪还能语音播报,快搞起来!
  14. core dumped ?完了?
  15. java实现RabbitMQ消息队列
  16. java未来发展潜力_Java语言未来是否还有发展前景
  17. java基础之TreeMap
  18. Python爬取淘宝图片
  19. 他是学计算机的这个句子中宾语是动词性的,语法一实词(教师)2017级
  20. 穆迪ESG解决方案事业部旗下公司V.E就西班牙王国的主权绿色债券框架提供第二方意见

热门文章

  1. 利用全局数据实现数据通信
  2. 树莓派:关于linux内核
  3. 5获取按钮返回值消息_大数据从入门到深入:JavaEE 之 项目实战 项目基础编码阶段(5)...
  4. Pangolin在cmake时报“Could NOT find GLEW”错误
  5. tensorflow-TFRecord 用法
  6. python爬取动态网站
  7. mongodb distinct too large用 group
  8. mpvue 微信小程序api_第三方框架与原生微信小程序开发框架性能之比较 | Q荐读...
  9. SiameseNet(Learning Text Similarity with Siamese Recurrent Networks)
  10. GraphSAGE: Inductive Representation Learning on Large Graphs