- 博客(88)
- 收藏
- 关注
原创 善于利用window挂在全局变量
开发过程成中遇到一个奇怪的问题,打开一个echats图表之后,关闭echarts图再进入其他页面页面会报错提示“"赋值给window,在跳转的页面中let $ = window.$解决问题。却回不到原来的版本。最后的解决办法是在关闭。文件然后在本地绘制而成。图后,再页面中插入的引入。标签也会去掉,但程序中的。经过一步步定位,发现。文件中有另一个版本的。文件,导致原来使用的。
2024-03-15 14:32:49 623 1
原创 换个思路,豁然开朗
遇到一个bug参数的格式不对,导致原有逻辑报错,本以为是哪里定义参数的地方有问题,查询几个小时无结果,结果是antd组件升级导致的树组件TreeNode格式变化。按照现有的数据格式,稍微调整下原有逻辑,代码立刻跑通,问题解决!遇到长时间无法解决的问题,可以先喝口水冷静几分钟,推翻原有逻辑,换个思路说不定豁然开朗。
2024-03-08 10:18:35 341
原创 React Hooks的理解
React中的数据实现响应式相对于Vue2来说要麻烦一些,Vue2中所有的变量都存放在了data当中,只要定义在data当中的数据,Vue底层就会自动把他们设置为响应式。React中的响应式数据被称作"state",state区别于普通变量,它实现了响应式,当我们修改它时就会触发React进行重新渲染。Vue3应该是参考了React中对于响应式的设定,取消了内部自动设置响应式的方式,而是需要开发者手动添加变量的响应式(ref、reactive)。
2024-02-23 16:00:06 470
原创 前端安全之XSS、CSRF
而如果黑客要对银行网站实施 CSRF 攻击,他只能在他自己的网站构造请求,当用户通过黑客的网站发送请求到银行时,该请求的 Referer 是指向黑客自己的网站。当你登录一个网站A后,在没有登出的情况下,你又跑到一个其他的论坛上闲逛,然后你看到一个美女的图片,你出于好奇心,点击了美女图片,这个时候,可能就被攻击了;原因是美女图片的的超链接(link)可能是不法分子弄的,指向的可能是A网站,由于你在A网站还是登陆态,那么你点击的这个link就是以你登录态的进行的,比如可以用你的登录态发布评论;
2024-01-28 21:58:43 1008 2
原创 前端缓存机制
浏览器的localStorage和sessionStorage等不属于浏览器的缓存概念,准确的说应该属于“浏览器的本地存储”不要讲两者混淆。
2024-01-22 13:08:53 1003
原创 自定义指令实现按钮防抖
created(el,binding,vnode,preNode){} // 在绑定元素的属性之前beforeMounted(el,binding,vnode,preNode) {} //在被插入到Dom前调用mounted(el,binding,vnode,preNode){} //在绑定他的父组件和他所有的子组件都挂载完毕后调用beforeUpdate(el,binding,vnode,preNode) {} //在绑定的父元素更新前调用。
2024-01-20 22:56:11 561
原创 ios适配虚拟home键
在H5开发过程中遇到一个兼容性问题。iphone手机的虚拟home键会对屏幕底部的内容造成遮挡。要处理此问题,需要清楚安全区域这个概念。
2024-01-20 16:48:02 1529
原创 字体文件压缩工具font-spider-plus
font-face是css3中允许使用自定义字体的模块,他主要是吧自己定义的web字体嵌入到网页中。
2023-12-27 20:14:33 1190
原创 图片懒加载
图片懒加载是一种节省性能的图片加载方法。通过判断图片是否进入可视区来控制它是否加载。我们为window.scroll做了防抖控制,这样能更好的提升性能。
2023-12-27 09:26:01 364
原创 React尝鲜
react的组件就是一个js函数,函数内部return一个由jsx语法创建的html代码片段。在需要引入组件的地方import导入组件,并放在相应位置。
2023-12-21 14:43:53 585
原创 BFC块级格式化上下文
BFC(Block Formatting Context)块级格式化上下文。是CSS渲染的一块独立区域,在这块区域内的元素布局不会影响到外面,同样,外面的元素布局也不会影响到里面。
2023-12-20 23:55:24 318
原创 webpack的配置与优化
webpack打包主要针对js文件,包括eslint、babel、terser(webpack内置插件,用于js压缩),因此我们主要对这三个工具开启多线程打包。每次打包js文件都要经过Eslint和Babel编译,速度比较慢,因此我们可以缓存之前的编译结果,提高下次打包速度。webpack 5的生产模式默认启动,它的作用是忽略文件中那些没有引用到的代码,从而减小代码体积、提高打包速度。打包时每个文件都会经过所有的Loader处理,虽然因为test正则原因没有实际处理,但是都要过一遍,比较慢。
2023-12-14 17:36:20 736 1
原创 webpack的使用
webpack 本身只能处理 js、json 等资源,其他资源需要借助 loader,Webpack 才能解析。指示 Webpack 打包完的文件输出到哪里去,如何命名等。指示 Webpack 从哪个文件开始打包。扩展 Webpack 的功能。
2023-12-12 10:53:28 568
原创 express框架使用
官方定义: 路由确定了应用程序如何响应客户端对特定端点的请求中间件(Middleware)本质是一个回调函数 中间件函数 可以像路由回调一样访问 请求对象(request) , 响应对象(response)每一个请求 到达服务端之后 都会执行全局中间件函数声明中间件函数//实现功能代码//.....//执行next函数(当如果希望执行完中间件函数之后,仍然继续执行路由中的回调函数,必须调用next)next();应用中间件声明时可以直接将匿名函数传递给 use。
2023-12-11 22:03:19 1060
原创 MongoDb数据库
1.显示所有数据库:show dbs2.切换到指定数据库,如果没有则自动创建数据库3.显示当前所在数据库db4.删除当前数据库use 库名。
2023-12-09 22:07:18 504
原创 v-for中key的作用
v-for在渲染的过程中采用就地复用的策略,列表修改数据的时候会根据key来判断某一项是否需要重新渲染,如果该项没有改变则继续复用。我们通常用数组的index来作为key但这其实是一种不推荐的方法。由于jason的插入导致数组的index发生变化,key和数据的一一对应关系也被破坏,那么虚拟dom的diff算法就会以为key和数据不再对应的数据是需要重新渲染的,如此一来就会增加没必要的内存消耗。如果我们直接在数组后面push一条name是john的数据进去,这样用index作为key是没问题的。
2023-09-15 21:07:12 80
原创 javascript 事件循环机制
由于js是单线程,所以需要事件循环机制来处理同步任务和异步任务之间的执行逻辑。那么Js为什么选择单线程呢?这是因为Js主要服务于浏览器中,用于控制浏览器的dom元素,试想下如果js是多线程那么会出现多个线程同时操作一个Dom元素的情况,显然这样是不可取的。
2023-09-14 19:32:04 100
原创 千变万化的Promise
Promise对象代表一个异步操作,有三种状态:pedding(进行中)、fulfilled(已成功)、rejected(已失败)。resovle函数的作用是将Promise对象的状态从pedding变为fulfilled,即从未完成变为成功。reject函数的作用是,将Promise对象的状态从未完成变为失败,在异步操作失败时调用,并将异步操作作为参数传递出去。所谓的Promise,简单来说就是一个容器,里面保存这某个未来才会结束的事件(通常是异步操作)的结果。
2023-09-14 12:57:59 85
原创 原型链(一定要搞懂啊!!!>-<)
javascript中每一个对象都有一个“隐式原型”:__proto__;每一个函数都有一个“显示原型”:prototype;对象的隐式原型指向了它的构造函数的显示原型上。
2023-09-12 16:46:05 64
原创 前端八股文之“闭包”
一句话概括闭包:能够访问函数内部变量的函数与这个变量的组合构成了闭包结构。如下代码如代码所示,fuc2和父级变量num构成了一个闭包环境。
2023-09-07 13:17:23 264
原创 vue动态绑定class
在vue框架开发中,有时候我们需要对元素的样式进行动态控制,比如tab按钮的切换。我们可以通过vue指令v-bind对元素的class进行动态控制。控制方式有对象和数组两种。
2023-02-28 10:21:04 1922
原创 js 中 .? 和 ??的用法
他叫做“可选链接操作符”,他的作用是可以省去判断对象属性是否存在就可直接调用。一般情况下当我们要调用对象的属性时,如果对象中没有这个属性,那么浏览器编译时就会报错。获取属性值,则浏览器不会报错。在js中叫做(空值合并操作符),他的作用是用于判断一个值是否为null或undefined,如果跟在他前面的值为null或undefined则取跟在他后面的值,否则就取他前面的值。
2023-02-17 17:19:01 2480
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人