Bootstrap 以外的常用樣式 - Material Design，小弟用得少，只介紹官方推薦的 vue-mdl(Material Design Lite)，支援 Vue 2.x。

已提供組件

• Checkbox
• Badge
• Switch
• Radio
• IconToggle
• Button
• AnchorButton
• Progress
• Spinner
• Slider
• Textfield
• Tooltip
• Menu
• MenuItem
• Card
• Snackbar
• Select
• Dialog
• Tabs
• Tab
• Chip
• Layout
• LayoutHeaderRow
• LayoutDrawer
• LayoutContent

安裝

透過npm

npm install --save vue-mdl

透過CDN

<script src="//rawgit.com/posva/vue-mdl/master/dist/vue-mdl.js"></script>
<!-- minify -->
<script src="//rawgit.com/posva/vue-mdl/master/dist/vue-mdl.min.js"></script>

使用方式

import VueMdl from 'vue-mdl'
import Vue from 'vue'

Vue.use(VueMdl)

new Vue({
  el: '#app',
  data: {
    checked: false
  }
})

<div id="app">
    <mdl-checkbox :checked.sync='checked'>Checkbox</mdl-checkbox>
</div>

官方文件 - 使用說明