- 博客(16)
- 收藏
- 关注
原创 vue使用el-table动态合并列及行
前两天项目中需要用到表单合并,特此记录,放便以后使用。 首先我使用的element-ui中的el-table,文档中提供span-method方法可以实现合并行或列,大家不熟悉的可以去看看element文档地址,但是文档提供的例子很简单,不能满足复杂的页面,所以需要处理一下数据。 如下代码:getListDataForRowAndColumn(data){ let self = this; self.rowAndColumn...
2021-01-27 18:35:34
2133
2
原创 记vue使用Element UI分页出现的问题
最近在整理之前项目代码时,无意间发现了几个隐藏的bug,这bug藏得真深啊~~~ 先上代码:<template> <div> <el-row class="page_title"> <el-col :span="24"> <span>操作日志</span> <hr> ...
2020-12-22 15:19:52
1415
3
原创 vue实现防抖、节流
序言 好久没写博客,正好今天项目需要增加防抖功能,特此记录一下。网上有很多例子,我试试了,没一个成功的(要哭了~~~~),最后参考别人的写法写了个,成功了。。。废话不说了,正文来了。防抖 使用场景:如搜索框,用户在输入的时候使用change事件去调用搜索,如果用户每一次输入都去搜索的话,就会消耗很大的服务器资源。如果每次用户停止输入后,延迟超过一定时间时,才去请求服务器的话,会节省服务器资源,提升用户体验。 原理:事件回调函数在一段时间(300毫秒)后才执行,如果在这段时...
2020-12-18 16:55:51
6427
7
原创 使用element UI中的Progress定义排行
原型图如下: 首先,这需要展示五条数据,每条的颜色都不一样,还要显示百分比,每条数据可分为上下两部分,上部分展示名字和百分比,下部分显示进度条。因为项目用的element,所以直接用它里面的Progress完成。 用flex布局很容易实现这种布局,可以用v-for循环展示出内容:progressData就是数据源,要修改它原有的样式.el-progress-bar__outer{border-radius:0;background-color:#3a3e63}...
2020-06-12 20:37:47
3905
3
原创 vue使用echarts做飞线图心得
最近在做大屏项目,其中要做飞线图。既然要做飞线图,当然要用echarts啦,不管你喜不喜欢,但是它的功能是十分强大的,关键还是开源的,用的非常爽。好了,开始走入正题。 首先,你得把echarts引入到你的项目中来 npm install echarts -S引入就来就可以开始你的表演了(嘻嘻~~~~)先来看下原型图上面有图片和信息展示,看着还挺炫酷的 先定义个chinaGeoCoordMap对象,用来放名字和地理坐标,如:var chinaGeoC...
2020-06-08 20:22:34
12982
13
原创 element-ui的el-select如何显示value对应的label值
在做项目当中遇到了如下图的情况:想要的结果应该是这样的怎样才能得到想要的结果呢,在网上一顿查找终于找到原因所在:由于得到的数据类型对应不上表单操作的数据类型。罪魁祸首在这啊,因为我从后台读取的数据类型时字符串,如下:所以才会出现上述情况,知道原因所在,就很好解决了,把value的值改成number类型的就OK了。写的不好请多多见谅。...
2020-02-18 17:59:25
4113
4
原创 vue-cli3.0 脚手架搭建项目
1.安装vue-cli 3.0npm install -g @vue/cli安装成功后查看版本:vue -V(切记一定要大写)如果遇到'vue' 不是内部或外部命令,也不是可运行的程序 或批处理文件。查看是否配置环境变量。2.创建项目在你新建的文件夹创建项目vue create 你的项目名称default 是 使用默认配置Manually select ...
2020-02-11 10:24:16
313
原创 'vue' 不是内部或外部命令,也不是可运行的程序 或批处理文件。
今天再用vue-cli3构建项目时,在输入vue -v后,突然报'vue' 不是内部或外部命令,也不是可运行的程序 或批处理文件。瞬间蒙圈,这咋回事啊,怎么突然报这错了。没办法去问度娘呗,搜了好多方法,还是不行。明明npm install -g @vue/cli已经安装了,为啥没找到呢,那这个又安装在哪了呢?继续问度娘,有点眉目了(哈哈哈)首先输入npm config list哇哦,终...
2020-01-08 14:54:22
4910
3
原创 vue中使用webVideoCtrl播放海康插件
最近公司有个监控视频的项目要用到webVideoCtrl插件来播放视频,研究了两天终于搞定。只需要传IP、用户名、密码、端口号即可播放,插件可在网上搜索下载。 新建文件夹来存放webVideoCtrl插件,然后在index.html中引进,如图:这样就把所需的插件引进去了,我们可以愉快的写代码了。注意要安装WebComponents.exe。贴出完整代码,子组件...
2020-01-02 11:10:25
11254
19
原创 Vue项目中使用海康安全生产平台播放监控视频
最近一直在做有关海康监控视频的项目,闲下来写下这篇文章,加深一下印象,同时也和大家交流一下经验,以便更好提升自己。废话不多说,开始正题。。。。 首先把海康插件引进到项目中来然后在index.html中引进最后把完整代码贴出来,不一一介绍了(懒~~~~)<template> <div class="video-player">...
2019-12-31 18:05:42
6069
9
原创 解决VM21248:1 Uncaught ReferenceError: xxx is not defined错误
今天在写项目的时候,遇到VM21248:1 Uncaught ReferenceError: xxx is not defined错误,特此记录,以便加深印象。我是要写table行循环滚动。代码如下:但运行的时候出现如下报错:tableInterval()这函数已经定义了,却报出未定义,后来经过上网查找,终于找到问题所在。原来是setInterval("tableInter...
2019-09-29 16:13:33
18575
原创 初识Virtual DOM
vue和React都用到了Virtual DOM,出于好奇和对知识的渴望,就上网查了一下,并整理写篇文章增加记忆。什么是Virtual DOM本质上来说,Virtual DOM只是一个简单的JS对象,并且最少包含tag、props和children三个属性。不同的框架对这三个属性的命名会有点差别,但表达的意思是一致的。它们分别是标签名(tag)、属性(props)和子元素对象(childr...
2019-03-09 15:19:00
386
原创 js闭包的理解
什么是闭包闭包,官方对闭包的解释是:一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分。闭包的特点: 1. 作为一个函数变量的一个引用,当函数返回时,其处于激活状态。 2. 一个闭包就是当一个函数返回时,一个没有释放资源的栈区。 简单的说,Javascript允许使用内部函数---即函数定义和函数表达式位于另一个函数的函数体内。而且,...
2019-03-01 12:49:25
410
原创 js事件委托
什么是事件委托:它还有一个名字叫事件代理,JavaScript高级程序设计上讲:事件委托就是利用事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件。通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却加到别人身上来做,完成这个事件。也就是:利用冒泡的原理,把事件加到父级上,触...
2019-02-28 20:40:43
211
转载 JavaScript 运行机制
一、为什么JavaScript是单线程?JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事。那么,为什么JavaScript不能有多个线程呢?这样能提高效率啊。JavaScript的单线程,与它的用途有关。作为浏览器脚本语言,JavaScript的主要用途是与用户互动,以及操作DOM。这决定了它只能是单线程,否则会带来很复杂的同步问题。比如,假定JavaScri...
2019-02-20 17:49:28
96
原创 js延迟加载的几种方式
面试的时候遇到的,所以整理出来,方便记忆。 js延迟加载有助于提高页面加载速度,一般有以下几种:defer属性、async属性、动态创建DOM方式、使用JQuery的getScript、使用setTimeout延迟方法、让js最后加载。1.defer属性:HTML 4.01 为 <script>标签定义了 defer属性。用途:表明脚本在执行时不会影响页面的构造。...
2019-02-20 16:06:51
1301
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人