一个大屏监控的项目

写大屏监控,本人选择的是用vue、element ui、echarts、axios、vueg来构建的。

 1 vue init webpack my-project
 2 
 3 //安装依赖
 4 cd my-project
 5 cnpm install
 6 
 7 //加入elementUI
 8 cnpm i element-ui -S
 9 
10 //加入echarts
11 cnpm install echarts -S
12 
13 //加入 axios
14 cnpm install axios -S
15 
16 //加入vueg
17 cnpm i vueg -S

vueg是一个切换页面时转场的效果

1 import vueg from 'vueg'
2 import 'vueg/css/transition-min.css'
3 Vue.use(vueg, router);//←注意这一句应该在router实例化之后

为需要转场动画的<router-view>添加v-transition,如:

<router-view v-transition />

需要什么样的效果,就在那个页面的data中添加数据,如:

1  data () {
2     return {
3       vuegConfig: {
4         forwardAnim: 'touchPoint',//转场效果
5         duration: '.3',
6         disable:false
7       }
8     }
9   }

vueg转场效果还有别的,如果需要,自己去找效果:https://github.com/jaweii/vueg

我这个项目是3840*1920的大屏监控如有需要看的,请点击https://github.com/mengxiaobo130401/screens_monitor

猜你喜欢

转载自www.cnblogs.com/mxyr/p/9330718.html