自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(56)
  • 资源 (1)
  • 收藏
  • 关注

原创 十分钟彻底弄懂浏览器缓存机制原理

前言Http 缓存机制作为 web 性能优化的重要手段,对于从事 Web 开发的同学们来说,应该是知识体系库中的一个基础环节,同时对于有志成为前端架构师的同学来说是必备的知识技能。但是对于很多前端同学来说,仅仅只是知道浏览器会对请求的静态文件进行缓存,但是为什么被缓存,缓存是怎样生效的,却并不是很清楚。在此,我会尝试用简单明了的文字,向大家系统的介绍HTTP缓存机制,期望对各位正确的理解前...

2019-10-05 10:48:34 963 1

原创 小程序和vue.js的区别(持续更新中~)

一、生命周期:1、小程序:onLoad----监听页面加载:一个页面只会调用一次,可以在onLoad中获取当前页面从上一级页面带过来的参数(通过options)。onReady----监听页面初次渲染完成:一个页面只会调用一次,代表当前页面已经准备妥当,可以和视图层进行交互。对界面的设置如 wx.setNavigationBarTitle请在 onReady之后设置。详见生...

2019-08-10 23:57:57 345 2

原创 微信小程序实现车牌键盘

一、效果图二、代码plateNumKeyboard.wxml<view class="pages"> <view class="box"> <view class='box-top'> <text>请输入车牌号:</text> </view> <view class="plate-input-body"> <view class="plat

2021-04-02 16:42:00 49

原创 微信小程序实现横屏手写签名

1.关键配置:"pageOrientation":"landscape" ---- 配置该页面横屏展示2.效果图:3.代码:wxml<view class="container"> <canvas class="canvas" id="canvas" canvas-id="canvas" disable-scroll="true" bindtouchstart="canvasStart" bindtouchmove="canvasMove" bin..

2021-03-26 16:28:21 94 2

原创 微信小程序下拉刷新在真机上不回缩问题的解决方法

别忘了写wx.stopPullDownRefresh()噢onPullDownRefresh:function(){ //...... wx.stopPullDownRefresh(); //停止下拉刷新 },

2021-03-25 11:54:24 36

原创 element优化---提交表单时焦点跳转至第一个校验不通过处

思路:1)获取所有不通过校验的元素(观察到不通过校验的元素都有一个class:is-error)2)第一个不通过校验的元素获得焦点实现:this.$refs[formName].validate((valid) => { if (valid) { } else { setTimeout(()=>{ var isError= document.getElementsByClassName("is-error

2021-03-23 16:04:23 21

原创 element踩坑记录1——el-table表格表头与内容对不齐

element踩坑记录1——el-table表格表头与内容对不齐解决方法:在全局样式中写入以下样式.el-table th.gutter{ display: table-cell!important;}

2021-03-23 15:53:36 48

原创 vue项目中一次下载多个文件的js实现

下载多文件时,将需要下载的文件的地址放到一个数组内,代码如下:allLoad() { for(let i=0;i<this.fileList.length;i++){ const iframe = document.createElement("iframe"); iframe.style.display = "none"; // 防止影响页面 iframe.style.height = 0; // 防止影响页面 iframe.src = this.fi

2021-03-09 17:16:59 129 1

原创 react 组件的三大属性----state、props、refs

一、statestate的介绍state是组件对象最重要的属性, 值是对象(可以包含多个数据),组件被称为"状态机", 通过更新组件的state来更新对应的页面显示(重新渲染组件)state的使用初始化指定constructor() { super() this.state = { stateName1 : stateValue1, ...

2020-03-18 13:36:51 84

原创 vue计算属性和方法的区别

1.methods方法:控制台打印:当修改其中一个属性时,其他属性的值都没改变,但会发现methods里的方法都被执行2.computed计算属性控制台打印:会发现当修改其中一个值的时候,只会执行于其相关的方法。3.总结:1).methods方法和computed计算属性,两种方式的最终结果确实是完全相同2).不同的是计算属性是基于它...

2020-02-07 13:38:34 1431

原创 vue2.0的计算属性computed和watch的区别以及各自使用场景

computed:通过属性计算而得来的属性 1、computed内部的函数在调用时不加()。即vm.属性名,如vm.reversedMessage2、computed是依赖vm中data的属性变化而变化的,也就是说,当data中的属性发生改变的时候,当前函数才会执行,data中的属性没有改变的时候,当前函数不会执行。3、computed中的函数必须用return返回。4、...

2020-02-07 13:27:24 337

原创 npx create-react-app命令卡死/不成功,更改成淘宝镜像

1、查看npm的镜像源 npm config get registry// 默认是:https://registry.npmjs.org/ 2、修改成淘宝的镜像源 npm config set registry https://registry.npm.taobao.org 3、create-react-app创建项目 npx create-react-app ...

2020-02-06 22:01:01 1623

原创 理解 CSS 布局和 BFC

前言CSS布局中有一些概念,一旦你理解了它们,就能真正提高你的 CSS 布局能力。本文是关于块格式化上下文(BFC)的。你可能从未听说过这个术语,但是如果你曾经用CSS做过布局,你可能知道它是什么,理解什么是BFC,怎么工作以及如何创建 BFC 非常有用,这些可以帮助你理解CSS中的布局是如何工作的。在本文中,通过熟悉的示例来解释什么是 BFC。然后说明display的一个新值,...

2019-12-09 16:59:10 54

原创 axios是如何封装 HTTP 请求的?

概述前端开发中,经常会遇到发送异步请求的场景。一个功能齐全的 HTTP 请求库可以大大降低我们的开发成本,提高开发效率。axios 就是这样一个 HTTP 请求库,近年来非常热门。目前,它在 GitHub 上拥有超过 40,000 的 Star,许多权威人士都推荐使用它。因此,我们有必要了解下 axios 是如何设计,以及如何实现 HTTP 请求库封装的。撰写本文时,axios 当...

2019-12-06 17:45:43 86

原创 Javascript异步编程的4种方法

前言:Javascript语言的执行环境是"单线程"(single thread)。所谓"单线程",就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一个任务,以此类推。这种模式的好处是实现起来比较简单,执行环境相对单纯;坏处是只要有一个任务耗时很长,后面的任务都必须排队等着,会拖延整个程序的执行。常见的浏览器无响应(假死),往往就是因为某一段Jav...

2019-12-06 14:59:32 40

原创 TCP为啥要3次握手和4次挥手?握两次手不行吗?

TCP有6种标识:SYN(建立联机)ACK(确认)PSH(传送)FIN(结束)RST(重置)URG(紧急)一、TCP三次握手第一次握手客户端向服务器发出连接请求报文,这时报文首部中的同部位SYN=1,同时随机生成初始序列号 seq=x此时,TCP客户端进程进入了 SYN-SENT(同步已发送状态)状态。TCP规定,SYN报文段(SYN=1的报文段)不能携带数据,但...

2019-12-03 15:26:29 481

原创 Promise原理及手写Promise

一、Promise原理:Promise 原理围绕以下三个问题进行解决:(有任何一步不了解的话请先往下看手写Promise,会一步步剖析原理,看完后再继续回顾这里!!)1. 怎么实现异步?Promise内部then函数注册后续需要执行的函数,resolve函数执行。需要保证函数在执行前都已注册好,解決:resolve内部执行函数的代码需要加入延时机制setTimeout...

2019-11-29 11:24:34 173

原创 什么时候不使用箭头函数

前言这些年来,ES6 将 JS 的可用性提升到一个新的水平时: 箭头函数、类等等,这些都很棒。箭头函数是最有价值的新功能之一,有很多好文章描述了它的上下文透明性和简短的语法。但每个事务都有两面。通常,新特性会带来一些混乱,其中之一就是箭头函数被误导了。本文将介绍一些场景,在这些场景中,你应该绕过箭头函数,转而使用良好的旧函数表达式或较新的简写语法。并且要注意缩短代码,因为这会影响代码...

2019-11-28 17:46:31 77

原创 微信小程序 父子组件传值通信

一、父组件传值给子组件1. 在父组件中引用子组件1.1 在父组件json中导入子组件1.2 在子组件的json中,把自己定义为子组件2. 在父组件中,子组件的引用处,绑定一个属性( text ),并传递想要给子组件的值( parentParam )3. 在子组件中的js中使用 properties 获取值,这样就可以在子组件中用 this.data.text ...

2019-11-28 15:20:57 148

原创 Vue 之keep-alive的使用,实现页面缓存

什么是keep-alive有时候我们不希望组件被重新渲染影响使用体验;或者出于性能考虑,避免多次重复渲染降低性能。而是希望组件可以缓存下来,维持当前的状态。这时候就需要用到keep-alive组件。官网释义:<keep-alive> 包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。和 <transition> 相似,<keep-alive&g...

2019-11-28 10:27:35 102

原创 git 使用 push 提交到远程仓库出现 The requested URL returned error: 403 错误

摘要:记录了使用push提交到远程仓库出现 The requested URL returned error: 403 错误的解决方法。问题描述电脑已经注册过一个 github 帐号,一直在本机使用,配置过 SSH。 新建另一个 github 帐号,本地建立好项目之后,使用命令:$ git push -u origin master时出现以下错误:问题原因...

2019-11-27 22:47:09 1210

原创 解读HTTP/2与HTTP/3 的新特性

前言HTTP/2 相比于 HTTP/1.1,可以说是大幅度提高了网页的性能,只需要升级到该协议就可以减少很多之前需要做的性能优化工作,当然兼容问题以及如何优雅降级应该是国内还不普遍使用的原因之一。虽然 HTTP/2 提高了网页的性能,但是并不代表它已经是完美的了,HTTP/3 就是为了解决 HTTP/2 所存在的一些问题而被推出来的。一、HTTP/1.1发明以来发生了哪些变化?如果...

2019-11-16 17:05:30 80

原创 js判断一个字符串是以某个字符串开头

方法1--substr() 方法substr() 方法可在字符串中抽取从start下标开始的指定数目的字符。if("123".substr(0, 2) == "12"){ console.log(true);}方法2--substring() 方法substring() 方法用于提取字符串中介于两个指定下标之间的字符。if("123".substring(0...

2019-11-12 15:45:44 1667

原创 微信小程序页面跳转如何传递对象参数

前情:首先我们有这么一种需求,就是我在一个列表中点击了某个item,跳转到详情界面,那么我就需要把item的实体数据从列表页面传递到详情页面,那么我们来看看微信小程序给我们提供的API:先看api:这里大家可以清楚看到api中说到的如何传递参数,其实它这里指的参数仅仅是一些普通的数据类型具体分析:这里我们要传递的实体是object类型,那么我们需要先把实体转...

2019-11-12 15:34:31 3663 2

原创 十分钟学会JS正则表达式

正则表达式(regular expression)描述了一种字符串匹配的模式,可以用来检查一个字符串是否含有某种子串、将匹配的子串做替换或者从某个字符串中取出符合某个条件的子串等。常用的正则字符1.\: 将下一个字符标记为一个特殊字符、或一个原义字符、或一个向后引用、或一个八进制转义符。例如,'n' 匹配字符 "n"。'\n' 匹配一个换行符。序列 '\' 匹配 "" 而 "\(" ...

2019-11-06 22:33:46 68

原创 微信小程序生命周期、页面生命周期、组件生命周期

1. 生命周期 App(全局)位置:项目根目录app.js文件App({ onLaunch (options) { // console.log('小程序初始化') }, onShow(options) { console.log('监听小程序启动或切前台') }, onHide() { console.log('监听小程序切后台'...

2019-11-06 15:40:06 2368

原创 javascript中关于类型判断的一些疑惑小结

javascript中关于类型判断的一些疑惑小结这篇文章主要给大家介绍了关于javascript中关于类型判断的一些疑惑,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧前言类型判断是我们在日常工作中经常会遇到的一个功能,本文将给大家详细介绍关于javascript类型判断的相关内容,下面话不多说了,来一起看看详细的介...

2019-11-05 11:48:45 61

原创 js的各种数据类型判断的介绍

js的各种数据类型判断的介绍今天小编就为大家分享一篇关于js的各种数据类型判断的介绍,小编觉得内容挺不错的,现在分享给大家,具有很好的参考价值,需要的朋友一起跟随小编来看看吧1.typeoftypeof 用来判断各种数据类型,有两种写法:type of xxx , typeof(xxx)例如:console.log(typeof 2) //输出 number conso...

2019-11-05 11:12:03 76

原创 搜索功能的实现----微信小程序

一、搜索功能的需求描述:数据:教师名字列表的数组1、搜索文本为空时,展示所有教师列表2、输入搜索文本,展示与搜索文本匹配的教师列表二、搜索功能的算法描述:1、声明一个数组存放搜索结果,2、判断搜索文本是否为空,为空则直接设置结果数组赋值为全部教师列表的数组3、若搜索文本不为空,先将搜索结果数组设置为空数组,遍历教师列表数组,利用indexOf函数判断每...

2019-11-03 15:18:04 509

原创 TCP是通过什么方式来提供可靠传输的

TCP是通过什么方式来提供可靠传输的(简述)1、合理截断数据包2、超时重发3、校验4、失序重新排序5、能够丢弃重复数据6、TCP可以进行流量控制TCP通过下列方式来提供可靠性:(具体)1、将数据截断为合理的长度-------应用数据被分割成TCP认为最适合发送的数据块。这和UDP完全不同,应用程序产生的数据报长度将保持不变。 ...

2019-11-03 15:02:21 2064

原创 js数组方法-改变原数组和不改变原数组的方法整理

改变原数组:pop():删除 arrayObject 的最后一个元素,把数组长度减 1,并且返回它删除的元素的值。如果数组已经为空,则 pop() 不 改变数组,并返回 undefined 值。arrayObject.pop()push():push() 方法可把它的参数顺序添加到 arrayObject 的尾部。它直接修改 arrayObject,而不是创建一个新的数组,...

2019-10-14 16:38:30 13700 3

原创 JS实现两个大数相加

对两个超大的整数进行加法运算,但又想输出一般形式,使用+是无法达到的,因为一旦结果值超过Number.MAX_SAFE_INTEGER就会被转换成科学计数法,并且数字精度相比之前将会有误差。此时需要自己写一套加法算法,原理就是小学学习加减法时候的算法,相应位数字相加,满十进一。function addBigNum(a, b){ //将a,b两个数转换为数组,并且将数组倒叙。 ...

2019-10-11 09:49:23 635

原创 8种常见数据结构及其Javascript实现

前言 做前端的同学不少都是自学成才或者半路出家,计算机基础的知识比较薄弱,尤其是数据结构和算法这块,所以今天整理了一下常见的数据结构和对应的Javascript的实现,希望能帮助大家完善这方面的知识体系。1. Stack(栈)Stack的特点是后进先出(last in first out)。生活中常见的Stack的例子比如一摞书,你最后放上去的那本你之后会最先拿走...

2019-10-09 16:55:27 43

原创 http状态码

五大类:100-199 信息性状态码 用于指定客户端应相应的某些动作。200-299 成功状态码 用于表示请求成功。300-399 重定向状态码 重定向用于已经移动的文件并且常被包含在定位头信息中指定新的地址信息。400-499 客户端状态码 用于指出客户端的错误。500-599 服务端状态码 用于指出服务器错误。几个常见的状态码:100 (Continue继续)---...

2019-09-18 10:54:06 100

原创 微信小程序开发总结(持续更新中~)

前言:在公司实习做小程序开发一段时间了,该文将会总结我在开发小程序过程中遇到的一些问题,并给出解决方案~一、ios 底部margin无效:问题描述:ios仅在底部需要撑开一定间距时,使用margin-bottom失效解决方案:不用margin来实现底部空白,直接多一个空白的view(设置好高度即可)不用padding的原因是padding在撑开间距的同时也会伴随容器自带...

2019-09-18 10:39:30 69

原创 map、filter、reduce方法

一、map方法map()函数——用于对数组或对象进行处理,并返回处理之后的数组.let arr = [1, 2, 3, 4];let newArr = arr.map(function(item) {// 使用map方法 return item * 2;});console.log(newArr);// [2, 4, 6, 8]二、filter方法filter()函...

2019-09-15 20:59:35 127

原创 水平、垂直居中方法总结

一、水平居中1、行内元素首先看它的父元素是不是块级元素,如果是,则直接给父元素设置text-align: center;<style> #father { width: 500px; height: 300px; background-color: skyblue; text-align: center; }</st...

2019-09-15 20:49:49 666 1

原创 八种常用清除浮动的方法

1、父级div定义伪类:after和zoom<style type="text/css"> .div1{background:#000080;border:1px solid red;} .div2{background:#800080;border:1px solid red;height:100px;margin-top:10px} .left{f...

2019-09-03 16:35:04 42

原创 各种排序算法的图解、js实现以及优缺点

一、插入排序最普通的排序算法, 从数组下标1开始每增1项排序一次,越往后遍历次数越多;已知一组升序排列数据a[1]、a[2]、……a[n],一组无序数据b[1]、 b[2]、……b[m],需将二者合并成一个升序数列。首先比较b[1]与a[1]的值,若b[1]大于a[1],则跳过,比较b[1]与a[2]的值,若b[1]仍然大于a[2],则继续跳过,直到b[1]小于a数组中某一数据a[x],则...

2019-09-03 10:31:37 174

原创 Vue中监听键盘事件----常用健无需匹配keyCode,直接使用别名就能监听按键的事件

一、背景在一些搜索框中,我们往往需要监听键盘的按下(onkeydown)或抬起(onkeyup)事件以进行一些操作。而在原生js或者jQuery中,我们需要判断e.keyCode的值来获取用户所按的键。这样就存在一个问题:我们必须知道某个按键的keyCode值才能完成匹配,使用起来十分不便。键盘事件:js中获取键盘事件:示例代码:document.ο...

2019-08-27 10:20:37 622

关于种猪生产成绩分析的数学模型

关于种猪生产成绩分析的数学模型

2018-06-11

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人 TA的粉丝

提示
确定要删除当前文章?
取消 删除