vue.js ui_Vue.js的简单轻量级Material设计UI

vue.js ui

语料 (vue-material)

Vue Material is Simple, lightweight and built exactly according to the Google Material Design specs

Vue Material简单，轻巧，并且完全按照Google Material Design规范进行构建

Build well-designed apps that can fit on every screen with support to all modern Web Browsers with dynamic themes, components on demand and all with an ease-to-use API

构建可在每个屏幕上显示的精心设计的应用程序，并支持所有具有动态主题，按需组件以及易于使用的API的现代Web浏览器

Build beautiful apps with Material Design and Vue.js

使用Material Design和Vue.js构建漂亮的应用程序

View demo 查看演示 Download Source 下载源

安装及使用 (Installation and Usage)

Install Vue Material through npm or yarn

通过npm或纱线安装Vue材质

npm install vue-material --save
yarn add vue-material

* Others package managers like JSPM and Bower are not supported yet.

*尚不支持其他软件包管理器，如JSPM和Bower。

Import or require Vue and Vue Material in your code:

在您的代码中导入或要求Vue和Vue材料：

import Vue from 'vue'
import VueMaterial from 'vue-material'
import 'vue-material/dist/vue-material.min.css'

Vue.use(VueMaterial)

Or use individual components:

或使用单个组件：

import Vue from 'vue'
import { MdButton, MdContent, MdTabs } from 'vue-material/dist/components'
import 'vue-material/dist/vue-material.min.css'

Vue.use(MdButton)
Vue.use(MdContent)
Vue.use(MdTabs)

Alternativelly you can download and reference the script and the stylesheet in your HTML:

或者，您可以下载并引用HTML中的脚本和样式表：

<link rel="stylesheet" href="path/to/vue-material.css">
<script src="path/to/vue-material.js"></script>

Optionally import Roboto font & Material Icons from Google CDN:

(可选)从Google CDN导入Roboto字体和材质图标：

<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic|Material+Icons">

翻译自: https://vuejsexamples.com/a-simple-and-lightweight-material-design-ui-for-vue-js/

vue.js ui