Calla_Lj的博客

浏览器缓存浏览器缓存分为强缓存和协商缓存—强缓存协商缓存共同点如果命中缓存服务器都不会返回资源同不同点不发送请求到服务器发送请求，通过请求进行Http再验证刷新ctrl+F5：强制刷新 ，将跳过强缓存和协商缓存；F5：只跳过墙缓存，但是会检查协商缓存。强缓存Expires：值为绝对时间的GMT格式的时间字符串，代表缓存资源的过期时间；Cache-Control：max-age 强缓存利用它判断强缓存的最大生命周期，单位为秒。协商缓存Las

Vue3.0vue3.0新特性简介数据响应式重新实现：ES6的proxy代替ES5的Object.defineProperty源码使用typescript进行重新编写，更严谨，更好的类型推导虚拟DOM新算法，更快更小提供了composition api，比option api更好的路基复用和代码组织自定义渲染器，克根据需求自定义各种各样的渲染器fragment,模板可以有多个根元素生命周期函数vue3 的生命周期钩子函数智能在setup里面使用vue3的生命周期函数与vue2对比

最近做了一个需求，就是excel附件上传，然后要将excel的文件内容解析为json格式的数据，然后再发送到后台进行处理。解析excel内容选用的插件是xlsx.full.min.js,其中有FileReader对象以及方法可以帮助我们实现解析：FileReader共有4种读取方法：1.readAsArrayBuffer(file)：将文件读取为ArrayBuffer。2.readAsBinaryString(file)：将文件读取为二进制字符串3.readAsDataURL(file...

主进程和渲染进程1. 主进程：在Electron中运行package.json和main脚本的进程称为主进程。例如，main.js文件属于主进程，同时在main.js文件中直接引入的js文件也属于主进程(如：require(’./mainProcess/menu.js’))2. 渲染进程：electron使用Chromium的多进程机制来渲染页面，每个页面拥有一个自己的进程，该进程称为渲...

VUE异步更新队列首先，Vue 在更新 DOM 时是异步执行的！所以只要侦听到数据变化，Vue 将开启一个队列，并缓冲在同一事件循环中发生的所有数据变更。如果同一个 watcher 被多次触发，只会被推入到队列中一次。这种在缓冲时去除重复数据对于避免不必要的计算和 DOM 操作是非常重要的。然后，在下一个的事件循环“tick”中，Vue 刷新队列并执行实际 (已去重的) 工作。Vue 在内部对...

单选框的小圆点不圆问题当我们有时候会做移动端的项目，使用到单选框的话，单选框的小圆点样式代码如下：.circle { display: inline-block; width:16px; height:16px; border: 1px solid #e0e0e0; border-radius:50%;}这样写其实是没有问题的，但是如果项目需要将px等单位整体进行转换...

Vue项目中的is属性is: 可以直接传递一个组件:is: 查找父组件中的一个赋值，然后找到相应的组件<div id="app"> <span>这是is=“show"的demo</span> <component is="show"></component> <span>这是:is=“show"的demo&lt...

px, em,rem,VW,VH,VM的不同点px: 固定的单位,像素em：继承父元素的字体大小rem：相对根元素，即html元素字体大小，需设置html的font-size=625%所以rem=16px*625%=100pxVW&VH: viewpoint width&viewpoint height1VW = 1/100视口宽度 1VH = 1/100视口...

hash和history的区别一、从用户的角度看路由需实现以下两个功能记录当前页的状态保存或分享当前页面的URL，再次打开该URL时，网页还是保存的分享时的状态可使用浏览器的前进后退功能（如点击后退按钮，可以使页面回到ajax更新页面之前的状态，url也回到之前的状态）二、作为开发者，要实现这两个功能，我们需要改变url且不让浏览器向服务器发出请求；监测url的变化；截...

基础混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。// 定义一个混入对象var myMixin = { created: function () { this.hello() }, methods: { hello: f...

微信小程序中封装wepy.request请求方法/** * 定制封装 wepy.request 请求方法 * 定制基础路径,公共的请求头 */import wepy from 'wepy'const baseUrl = 'http://localhost:8888/api/public/v1/'export default function (params) para...

函数节流function scrollFn(){ console.log(1)}function throttle(method,delay,duration){ var timer=null; var begin=new Date(); return function(){ var context=th...

利用json-server工具在本地开启json数据格式的服务器安装npm install json-server -g准备数据文件db.json:{ "in_theaters": [ { "id": 1, "title": "黄金兄弟", "rating": 5.3, "genres": [&quot

在服务器端使用Socket准备server.js和clients.js两个文件,分别代表说服务端可客户端,代码如下:server.js:const net = require ('net') // 引入net模块const server = net.createServer() // 创建server服务端const clients = [] // 创建一个数组,用来存储客户端...

数据劫持原理01.html:&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt;&lt;/head&gt;&lt;body&gt; &lt;script&gt; let obj = { name: 'zs

Vue如何实现数据双向绑定?Vue实现思路:说明:1. 实现一个Compiler模板解析器,能够对模板中的指令和插值表达式进行解析,并且赋予不同的操作2. 实现一个Observer数据监听器,能够对数据对象的所有属性进行监听3. 实现一个Watcher观察者,将Compiler的解析结果,与Observer所观察的对象连接起来,建立关系,在Observer观察到对象数据变化...

node.js 运行时报错"Command failed with exit code 1."问题描述今天运行本地项目,出现以下界面:由上可知,好像是webpack-cli的模块从webpack-dev-server里面分离出来了,所以需要安装webpack-cli然后就根据提示,使用"yarn add -D webpack-cli"安装webpack-cli包之后,再次运行...

发布/订阅者模式什么叫发布-订阅者模式?发布-订阅者模式: 也叫观察者模式;它定义了一种一对多的依赖关系,即当一个对象的状态发生改变的时候,所有依赖于它的对象都会通知并更新,解决了主体对象与观察者之间功能的耦合.例如: 微信公众号订阅者: 只需要订阅(关注)微信公众号发布者(公众号): 发布新文章的时候,推送给所有的订阅者发布-订阅者模式的优势:解耦合订阅者不用每...

eslint报错"Expected linebreaks to be ‘LF’ but found ‘CRLF’"问题描述:vue-cli -y搭建项目后,运行项目eslint报错"Expected linebreaks to be ‘LF’ but found ‘CRLF’"问题分析:出现原因是eslint语法检测linebreaks格式统一解决方法:在.es...

关于去掉箭头 且不能输入e和标点符号1.input数字框去掉箭头由图所示：数字框空间本来就很小,然后还被箭头占用;由图所示：数字框虽然css样式设置居中对齐,但是由于被箭头占用,所以不能居中对齐显示,不美观;由图所示：数字框空间本来就很小,由于箭头占用,导致两位数不能完全显示.结构代码如下:<input type="number" v-model="item5.OU...

Object.assign()用法讲解语法: Object.assign(target, …sources) target: 目标对象,sources: 源对象用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。const target = { a: 1, b: 2 };const source = { b: 4, c: 5 };const returnedTar...

HTML常见兼容汇总1.标准浏览器子元素不会撑开父元素设置好的宽度，IE6下会的；2.在IE6元素浮动，如果宽度需要内容撑开，就给里边的块元素都加浮动 ;3.在IE6，7下元素要通过浮动并在同一行，就给这行元素都加浮动4.IE6下，最小高度为19px;解决办法：overflow:hidden;5.IE 6下，1px dotted #000不支持，解决办法：切背景平铺；...

CSS常见的浏览器兼容汇总一、从浏览器内核的角度 来看，浏览器兼容性问题可分为以下三类：1. 渲染相关：和样式相关的问题，即体现在布局效果上的问题。2. 脚本相关：和脚本相关的问题，包括JavaScript和DOM、BOM方面的问题。对于某些浏览器的功能方面的特性，也属于这一类。3. 其他类别：除以上两类问题外的功能性问题，一般是浏览器自身提供的功能，在内核层之上的。二、浏览器兼容性相关...

JS常见的兼容性问题1） 滚动条：document.documentElement.scrollTop||document.body.scrollTop获取样式兼容function getStyle(dom, styleName){return dom.currentStyle?dom.currentStyle[styleName]getComputedStyle(dom)[st...

Offset,Scroll和Client三大系列总结offset系列scroll系列client系列offsetWidthscrollWidthclientWidthoffsetHeightscrollHeightclientHeightoffsetLeftscrollLeftclientLeftoffsetTopscrollTopclie...

鼠标的screen,client和page三个重要坐标系列作为一名前端开发人员,我们有时候需要获取鼠标在页面上的点击位置,我们都知道鼠标的点击事件中有screen,client和page三个系列的坐标,那马我们下面就来具体分析一下:三个重要坐标.js:document.onclick = function (event) { var event = event || window.even...

http反向代理解决跨域问题

你要的 React 面试知识点，都在这了https://juejin.im/post/5cf0733de51d4510803ce34e

http协议1.0和1.1的区别一个WEB站点每天可能要接收到上百万的用户请求，为了提高系统的效率，HTTP 1.0规定浏览器与服务器只保持短暂的连接，浏览器的每次请求都需要与服务器建立一个TCP连接，服务器完成请求处理后立即断开TCP连接，服务器不跟踪每个客户也不记录过去的请求。但是，这也造成了一些性能上的缺陷，例如，一个包含有许多图像的网页文件中并没有包含真正的图像数据内容，而只是指明了这些...

Next.jsNext.js是一个基于React的服务端渲染框架。它使用react语法，可以很好的实现代码的模块化，有利于代码的开发和维护。Next.js的特性：默认服务端渲染模式，以文件系统为基础的客户端的路由代码自动分割使页面加载更快以webpack的热更新HMR为基础的开发环境使用React的JSX和ES6的module，模块化和维护更方便可以运行在express和其他Nod...

服务端渲染什么是服务端渲染？前端渲染：html页面作为静态文件存在，前端请求时后端不对该文件做任何内容上的修改，直接以资源的方式返回给前端，前端拿到页面后，根据写在html上的js代码,对该html内容进行修改。服务端渲染：前端发出请求后，后端在将html页面返回给前端之前，先把html页面中的特定区域，用数字填充好，再将完整的html返回给前端。在SPA场景下，服务端渲染都是针对第一次g...

5分钟快速学会JSXJSX: 是React引入的新的语法,从名字上我们就能看出,其实JSX的本质还是JS,它是一种 JavaScript 的语法扩展。依照惯例,我们从一个hello world的demo来开始我们的学习HTML代码:&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html lang=&quot;en&quot;&amp;gt;&amp;lt;head&amp;gt; &amp;l

Element-ui 下拉组件的验证失效问题问题描述: 在使用Element-ui组件做项目开发时候有可能会使用下拉框组件,如果下拉框组件的option选项是使用v-if指令遍历的, 就会出现下拉框验证时失效问题.问题现象:如图所示,明明已经选择了选项,可是验证还是为空,因此不能提交请求解决办法:确认触发方式为change事件增加相对应的type属性代码r...

适用于主流浏览器导出Excel表格的代码问题描述:有时候写项目会遇到在网页点击按钮可以把网页上显示的table表格数据从浏览器上直接下载下来,优点是用户可以自由选择有价值的数据进行下载到用户本地然后用Excel软件进行数据的各种操作.有了需求,那么问题就来了,怎样写适用于主流浏览器的导出表格代码,或者是其他浏览器导不出表格的问题如歌解决呢?问题代码:问题现象:我在做项目是就遇到了项...

几种常用git指令Git config --global user.name xxx 配置用户名Git config --global user.email xxx 配置邮箱Git config user.name 查看用户名Git init 初始化Git add . 添加到暂存区Git status 查看文件状态Git commit -m “备注” 提交本地仓库touch .gi...

Canvas基础1. 这个图从哪里来A)展示绘图效果的标签,行内块元素B)打开canvas,(通过getContext方法打开),然后在上面绘图2.Canvas绘图步骤A)移动到开始位置.moveTo(x,y)B)开始画线条.lineTo(x,y)C)描边显示.stroke()3.画布大小在canvas标签设置A)4.描边颜色: .strokeSty...

单点登录的cookie跨域设置单点登录原理当公司有好多系统存在并运行时候,用户每个系统使用之前都需要登录认证,操作起来就比较重复,用户体验感不好,然后就衍生出来单点登录.如下图所示:单点登录: 英文名(Single Sign On), 公司内部所有应用系统共享一个身份认证系统,让用户只登录一次，就必须让应用系统能够识别已经登录过的用户, 从而完成单点登录的功能。单点登录优点:1）提高...

移动端兼容 &amp;amp;amp;lt;meta name=&amp;amp;quot;viewport&amp;amp;quot; content=&amp;amp;quot;width=device-width,initial-scale=1.0&amp;amp;quot;&amp;amp;amp;gt; &amp;amp;amp;lt;meta http-equiv=&amp;amp;quot;Content-Type&am

VUE项目在IE下运行钩子函数抛出异常“ReferenceError: “Promise”未定义&quot;”的解决办法VUE项目在IE下运行钩子函数抛出异常“ReferenceError: “Promise”未定义&quot;”的解决办法...

主流浏览器内核汇总1、IE：Trident内核，也是俗称的IE内核；2、Chrome：统称为Chromium内核或Chrome内核，以前是Webkit内核，现在是Blink内核；3、Firefox：Gecko内核，俗称Firefox内核；4、Safari：Webkit内核；5、Opera：最初是自己的Presto内核，后来加入谷歌大军，从Webkit又到了Blink内核；6、360浏览...