码迷,mamicode.com
首页 > 其他好文 > 详细

一个大屏监控的项目

时间:2018-07-18 19:11:38      阅读:432      评论:0      收藏:0      [点我收藏+]

标签:nim   自己   ref   touch   转场动画   cnpm   conf   span   大屏   

写大屏监控,本人选择的是用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

一个大屏监控的项目

标签:nim   自己   ref   touch   转场动画   cnpm   conf   span   大屏   

原文地址:https://www.cnblogs.com/mxyr/p/9330718.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!