vue-material | 易学教程

9 个优秀的 Vue开源项目,帮助你快速理解Vue框架

阅读更多关于 9 个优秀的 Vue开源项目,帮助你快速理解Vue框架

Vue.js 作为现在的前端主流框架之一，在国内有着广泛的应用，也是面试几乎都会问到的内容，经常会问到： Vue的新特性都有什么？ Vue的性能如何优化？如果能够看懂它的源码，熟悉它的各种使用技巧，对你的入职大厂，升职加薪有极大的助益！今天来分享9个非常不错的开源项目，可以帮助我们理解Vue框架。使用Vue的好处该框架非常小。约为18–21KB； Vue 支持用基于组件的方法来构建 Web 应用；详细的文档。这对于初学者来说很容易上手；易于理解。由于其结构简单，你可以轻松地把 Vue.js 添加到自己的 Web 项目里。它凭借定义良好的体系结构来保存你的数据。生命周期方法和自定义方法是分开的；轻松的集成。你可以通过 CDN 来轻松添加 Vue.js，不依赖 Node.js 和 npm 环境就可以用。完全可以把它当成替代 jQuery 的绝佳选择；出色的工具。通过 Vue CLI ，你可以使用内置的路由、状态存储、Lint、单元测试、CSS预处理器、Typescript、PWA 等来启动新项目。此外，Vue CLI 还提供了用于管理项目的UI。 Vue开源项目下面汇总了一些非常流行的工具和库，并包括在 Vue 生态系统中所涉及到的其他库和插件。是根据其有用性、有效性、文档、思想和贡献指南进行选择的。 UI组件 Vuetify 网站： https:

How to set up flexible grid in Vue Material

阅读更多关于 How to set up flexible grid in Vue Material

问题 I am attempting to build an interface that uses Vue-Material to render user-inputted cards in a grid. the cards render properly. However, I want my grid to flex, justify, and stagger the different-sized cards in a way that removes gaps, as seen below: The following code corresponds with the above grid: <template> <div class="content"> <div class="md-layout"> <div v-for="post in posts.slice().reverse()" :key="post.id" class="md-layout-item md-size-20 md-xsmall-size-100" > <md-card> <md-card

How do I change colors on a Vue Material theme

阅读更多关于 How do I change colors on a Vue Material theme

问题 I am using the Vue Material default-dark theme by adding the following into my index.js file... // index.js Where the vue instance is instantiated import 'vue-material/dist/theme/default-dark.css'; ... import Vue from "vue"; ... Vue.use(VueRouter); const routes = [ { path: '/', component: Viewport, ... } ] ... window.app.$mount('#jg-app'); This works great but now I want to change the colors on the theme. To do this I added the following to my template... // viewport/Viewport.vue <styles src=

Custom Vue Material md-Input how to get isDirty or isTouched

阅读更多关于 Custom Vue Material md-Input how to get isDirty or isTouched

问题 I would like to create my own CustomMdInput, with basic validation. I would like to implement a input that work that way: I use a <fp-input v-model="test"></fp-input> , and It is important, that when this input is required, when someone clicked on it or typesomething (turns 'touched' or 'dirty' property), and next defocus this input and go to the another input, the previous one stays Invalid with all the validation, so i have something like this: <template> <div class="md-layout-item"> <md

I am attempting to add a background image to my vue.js project

阅读更多关于 I am attempting to add a background image to my vue.js project

I want to add a background image that covers the whole page. However this is how it looks now : I want it to span the whole web page. How would this be done in vue.js? I also want an animated toolbar so that when the page is not scrolling the toolbar is transparent and takes the look of the background image. When it scrolls the toolbar will have the current blue color Here is my fiddle vue.js project THIS is the HTML <template> <div id = "background"> <div class = "" id = "explain"> <h1 class = "md-title">{{ message }}</h1> <h3> Collect, analyse and do better with data!</h3> </div> <hr> <md