前两天百度,发现一个以前没用过的框架:Vuetify~ 这个也是个组件库,好像还蛮好用的,很方便,还能快速建站(vuex+vue-router+vue-router-sync+vuetify),主要讲一下安装和初始化,快速建站看文章后面的链接
一,关于vuetify的安装以及使用
1.npm install --save vuetify
2.在main.js里引入并且使用
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'
Vue.use(Vuetify)
3.在根元素绑定那里初始化:
在new Vue({
el:'#app',
vuetify:new vuetify(),
})
4.在app.vue里
<template>
<v-app id='app'>
<router-view></router-view>
</v-app>
</template>
就这样我们的安装以及初始化就完成了,在各个.vue文件里直接使用Vuetify就可以了,vue add vuetify这条命令就能让vuetify直接用了,打开后的界面是这样式儿的:
二,快速建站,要先安装Vuetify + Vuex + Vue-router + Vue-router-sync
// src/main.js import Vue from 'vue' import Vuetify from 'vuetify' import App from './App' import store from './store' import router from './router' import { sync } from 'vuex-router-sync' Vue.use(Vuetify); sync(store, router); new Vue({ el: '#app', router, store, template: '<App/>', components: { App } });
后续可看https://www.jianshu.com/p/eb863de83226,这篇文章写得很好,nice!
彩蛋:关于vuetify里的色彩,可以看这一篇来了解:https://conyli.cc/archives/2764
vuetify的视差,可以参考这篇:https://blog.csdn.net/OnismYY/article/details/86539211