- 博客(25)
- 收藏
- 关注
原创 js高阶函数之map、reduce、filter、sort、some、every、find、findIndex、from方法
Array.from还可以接受第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组。reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。返回数组,包含了符合条件的所有元素。find() 方法返回通过测试(函数内判断)的数组的第一个元素的值。
2023-07-05 16:06:39
1006
原创 渲染性能优化相关补充
一种可靠的方法就是加入元素时不要修改页面上已经存在的元素,而是在内存中的节点进行大量的操作,最后再一并将修改运用到页面上。缓存DOM对象的方式也经常被用在元素的查找中,查找元素应该是DOM操作中最频繁的操作了,其效率优化也是大头。在一般情况下,我们会根据需要,将一些频繁被查找的元素缓存起来,在查找它或查找它的子孙元素时,以它为起点进行查找,就能提高查找效率了。这里的每一次循环都会去查找id为container的元素,效率自然非常低下,所以可以将元素在循环前查询完毕,在循环中仅仅是引用就可以了。
2023-07-04 15:14:37
174
原创 VUE知识点补充
顾名思义,服务端渲染就是在浏览器请求页面URL的时候,服务端将我们需要的HTML文本组装好,并返回给浏览器,这个HTML文本被浏览器解析之后,不需要经过 JavaScript 脚本的执行,即可直接构建出希望的 DOM 树并展示到页面中。Vue 中是通过对每个键设置 getter/setter 来实现响应式的,开发者使用数组,目的往往是遍历,此时调用 getter 开销太大了,所以 Vue 不在数组每个键上设置,而是在数组上定义。上面是对对象的数据进行监听的,我们不能对数组进行数据的“劫持”。
2023-06-30 17:09:04
332
转载 VUE原理及运行机制
在修改对象值时,会触发响应的setter,setter通知之前【依赖收集】到的Dep 中的所有watcher,告诉他们自己的值变了,需要重新渲染视图。3.设置一个解析器 Compile,可以扫描和解析每个节点的相关指令(v-model,v-on等指令),如果节点存在 v-model,v-on等指令,则解析器 Compile 初始化这类节点的模板数据,使之可以显示在视图上,然后初始化相应的订阅者(Watcher)如果修改了text3的数据,但视图中不需要text3,所以并不需要调用cb函数。
2023-06-18 16:05:34
1385
原创 VUE子组件更改父组件数据
在有些情况下,我们可能需要对一个 prop 进行“双向绑定”。不幸的是,真正的双向绑定会带来维护上的问题,因为子组件可以变更父组件,且在父组件和子组件都没有明显的变更来源。这也是为什么我们推荐以 update:myPropName 的模式触发事件取而代之举个例子,在一个包含 title prop 的假设的组件中,我们可以用以下方法表达对其赋新值的意图:this.$emit(‘update:title’, newTitle) 然后父组件可以监听那个事件并根据需要更新一个本地的数据 property。
2023-06-12 16:53:49
12041
原创 VUE 组件间传值的几种实现方式
常见的使用场景可以分为三类:父向子传递数据通过 props,子向父传递数据通过 $emit (event);$parent / $children:访问父 / 子实例;ref 访问组件实例;全局事件总线(Event bus) $emit / $on;Vuex全局事件总线(Event bus) $emit / $on;Vuex。
2023-06-11 15:34:02
4290
原创 之前的项目前端技术说明
右侧异常次数的表格内嵌套图表的实现与应用列表相同。特殊功能点:点击新增一行后新增一行Tag键和Tag值的下拉输入框,实现思路是定义一个数组,通过控制数组的长度V-for实现页面上Tag键和Tag值下拉框的展示,Tag键和Tag值的select组件要定义mode="combobox"才能实现可搜索输入。时间轴实现的思路:定义时间轴的总长为420px,根据当前行的耗时与总耗时的耗时比 得到当前行时间轴的长短,控制时间轴的长度,再定义一个数据记录表格内每一行的时间轴为背景蓝色还是一个绿色竖条。
2023-05-09 16:06:58
302
原创 vue项目运行时报错TypeError: fsevents.watch is not a function
运行几年前的项目时报错:TypeError: fsevents.watch is not a function
2023-05-08 10:20:31
4892
原创 关于批量取消axios请求功能的实现
最近项目有个接口要遍历去请求数据(别问,问就是后端只给单个的数据),同时发出几十个请求,而且接口又慢!只能做操作时取消请求处理。
2022-09-28 09:57:03
281
原创 写代码时用到的
1.获取滚动条位置document.documentElement.scrollTop=02.JS获取容器的宽高dom.style.width //只能获取内联样式所设的宽高dom.currentStyle.width //获取页面渲染完成后的宽高,只有IE支持window.getComputedStyle(dom).width //与上条原理一样,但兼容更多浏览器dom.getBoundingClientRect.width //根据元素在视窗的绝对位置来获取宽高dom.offsetWid
2021-10-26 16:51:07
94
原创 关于VUE使用antD table组件设置fixed和ellipsis无效问题
创建新的less文件(需要在组件中引入该less文件)或在antD设置全局样式的less文件中添加如下样式:.ant-table-fixed-left table,.ant-table-fixed-right-right table{ width:min-content; }
2021-10-26 16:31:05
2937
原创 v-show的值为数组的某个值,不起作用的情况
v-if=arr[index] 当arr[index]改变的时候试图不会更新变化,这个时候需要做特殊处理(v-show同理)vue官方提供方法:this.set(this.vshowValue,i,false)//vm.set(this.vshowValue,i,false) //vm.set(this.vshowValue,i,false)//vm.set(arr,index,newValue)...
2021-08-27 15:43:14
313
原创 VUE面试题总结
VUE面试题总结对于MVVM的理解?VUE的生命周期及理解?第一次页面加载会触发哪几个钩子?Vue实现数据双向绑定的原理Vue组件间的参数传递Vue路由的两种模式v-if和v-show的区别?v-if和v-for同时使用在同一个标签上的表现?v-for中的key的理解?v-model的理解computed和watch的用法和区别?computed和methods的区别?data为什么是一个函数?vue单页面和传统的多页面的区别?vue的修饰符vue更新数组时触发视图更新的方法?vue-router有哪几种导
2021-08-27 15:39:52
179
原创 CSS面试题总结
CSS面试题介绍一下标准的CSS的盒子模型?低版本IE的盒子模型有什么不同的?CSS选择符有哪些?哪些属性可以继承?CSS优先级CSS3新增伪类有哪些css实现垂直水平居中css水平、垂直居中的写法什么是css Hack?行内元素有哪些?块级元素有哪些?空元素有哪些?行内元素和块级元素的区别?1rem、1em、1vh、1px各自代表的含义画一条0.5px的直线画一个三角形< img > 的title和alt有什么区别?语义化的理解HTML5有哪些新特性?移除了哪些元素?link和@import的
2021-08-27 15:06:50
224
2
原创 JavaScript基础面试题总结
面试会问到的问题写JavaScript的基本规范JavaScript代码中的“use strict”是什么意思?使用它区别是什么?严格模式的限制渐进增强和优雅降级JS数据类型介绍js有哪些内置对象?JavaScript原型,原型链 ? 有什么特点?Javascript如何实现继承?JavaScript创建对象的几种方式Javascript作用链域解释什么是事件代理?eval是做什么的?null,undefined 的区别?事件模型new操作符具体干了什么?什么是闭包?说说你对闭包的理解?Javascript
2021-08-27 13:59:48
207
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人