- 博客(35)
- 收藏
- 关注
原创 el-form无法适时触发更新
原理:受 ES5 的限制,Vue.js 不能检测到对象属性的添加或删除。因为 Vue.js 在初始化实例时将属性转为 getter/setter,所以属性必须在 data 对象上才能让 Vue.js 转换它,才能让它是响应的。写增加和修改功能,form一样,为了省事两个用了同一个form。在修改时,回显后的日期选择控件无法修改了。要处理这种情况,我们可以使用$set()方法,既可以新增属性,又可以触发视图更新。测试后发现修改后的数据可以得到,也就是只是页面显示问题。
2022-09-15 11:28:33
941
原创 git 代码由旧仓库转移到新仓库某分支
需要对应上分支名。1.git remote rm origin2.git remote add origin git@github.com:sheng/demo.git3.git push提交到master需要最高管理权限。
2021-11-02 15:07:42
303
原创 iframe下载使文件进度可见
<el-button type=“text” size=“small” @click=“handleDownload(scope.$index, scope.row)”>下载结果 async handleDownload(index, row) { this.loadingOverLay = this.$loading({ lock: true, text: '文件生成中',
2021-11-01 18:54:49
561
原创 后台管理系统工作技术点记录
1.反向修改组件的值 加修饰符.sync发射可以直接update修改属性值2.复杂数据可以提取JSON对象来替换繁琐的if判断3.高德地图有一些获取经纬度的方法可以复用。提取到common.js里再导入方法来用。4.提交表单时如果网慢,重复点击会提交多次同一张表单,可以在elementui上的按钮添加loading属性。避免网卡时多次点击重复提交。...
2021-02-26 00:05:45
1044
原创 处理异步操作演变详解:回调函数、Promise、Generator、async和await
处理异步操作演变回调函数==>Promise对象==>Genarator函数==>async和await回调函数客户端JS在浏览器是单线程运行,会将同步任务先执行完毕再执行异步任务以保证运行过程不阻塞,但有时我们在调用一个同步任务前需要拿到上一个异步任务的结果,所以需要回调函数帮助实现。 <script> function getMessage(msg,callback){ setTimeout(() => {
2020-11-22 14:22:17
116
原创 高阶函数:闭包、递归
异步任务:1.回调函数2.定时器3.ajax回调函数一、高阶函数高阶函数是对其他函数进行操作的函数,它接收函数作为参数或将参数作为返回值输出。函数也是一种数据类型,同样可以作为参数传递给另一个参数使用,比如回调函数。 function fn(callback) { callback && callback(); } fn(function () { alert("hi"); }
2020-08-16 17:37:51
207
原创 创建对象的演化:四种方式
一 构造函数形式创建对象缺点:添加属性过于繁琐var obj = new Object(); obj.name = "libai"; obj.age = 12; // 添加属性繁琐 -> 字面量形式 var obj1 = { name: "libai", age: 12 } var obj2 = { name: "libai",
2020-08-13 22:38:53
123
原创 作用域题、对象属性新写法、对象里的数据属性、双向绑定
一 作用域题 1. 变量、函数声明提升 2. 按顺序执行 3. 关于 this -> 调用函数前面没有加 xx.fn() 都指向window -> 匿名函数指向 window 对象 var 没有块状作用域的概念/ let、const var foo = 1; function bar() { if (!foo) { var foo = 1
2020-08-13 22:01:21
308
原创 函数、闭包总结
一、函数函数:n条语句的封装体创建function 函数名(){} 声明函数:一经声明,全局调用(不在意书写位置)。var 函数名 = function(){} 函数表达式 :匿名函数若带上名字,名字失效。**构造函数 var 函数名 = new Function(参数, 语句) **不常用属性- name 函数的名字- length 返回函数的形参个数形参、实参- 形参个数 > 实参个数 多余的形参值是 undefined- 形参个数 <
2020-08-12 22:35:42
123
原创 JS数据类型判断、深浅克隆
一、数据类型判断栈:原始数据类型(undefined,null,Boolean,Number,String)堆 :引用数据类型(对象,函数,数组)两者的区别在于,存储的位置不同.boolean typeof -> booleanstring typeof -> stringnumber typeof -> number 特殊值:Infinity正无穷大 / -Infinity负无穷大 / NaN
2020-08-12 20:51:02
214
原创 链式操作原理和隐式迭代
链式操作原理:每次调用函数都返回调用函数的对象var $box = $(".box"); var boxReturn = $box.css("width", "200px"); console.log(boxReturn == $box); // true var boxReturn2 = boxReturn.animate({ height: 200 }); console.log(boxReturn2 == $box); //
2020-08-11 17:43:28
302
原创 onload、window.open、同源策略、history对象、location对象、navigator对象
1.loadwindow.onload 页面全部加载事件,包括CSS、页面图像都加载完才会触发该事件。window.addEventListener(“DOMContentLoaded”,function(){}) 只要DOM树结构加载完就会触发,更快些。2.window.open() / window.close() var windowObjectReference = window.open(strURL,[strWindowName], [strWindowFeatures]);
2020-08-07 17:56:15
716
原创 单线程、同步异步原理
// JS的异步是通过回调函数实现的。 一般有三种类型: 1.普通事件:如click、resize等 2.资源加载,如load、error等 3.定时器:如setInterval、setTimeout等 异步任务相关回调函数添加到任务队列中。(任务队列也称为消息队列) JS执行机制: 1.先执行执行栈中的同步任务。 2.异步任务(回调函数)放入任务队列中。 事件循环: 由于主线程不断的重复获得任务、执行任务、再..
2020-08-06 20:20:01
346
原创 防抖与节流
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .box {
2020-08-05 21:04:20
126
原创 事件冒泡、捕获、委托、行为型事件委托
事件捕获、事件冒泡事件监听: 允许对同一个事件进行多次监听(添加多个事件处理函数)element.addEventListener("事件名", 事件处理函数, 是否采取捕获boolean --默认false)取消事件绑定:element.removeEventListener("事件名", 声明函数的名字)element.on事件名 = null捕获事件:目标元素的父类元素能够捕捉到子类添加的事件,当事件触发时,可以先行触发自己相应事件的绑定函数事件冒泡:目标元素事件触发
2020-07-31 10:45:21
132
原创 循环绑定事件
点击进行隔行换色,发现在for循环下添加点击事件,会走完for循环再进行异步事件处理。两种解决方法:1.使用立即执行函数好处:保留函数变量,创建一个独立空间。<body> <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5<
2020-07-27 20:30:28
310
1
原创 函数
创建函数方式方式一 function 关键字创建 具名函数// foo 叫做 函数名// ()里边填写函数的 参数 function foo(){ console.log('我是一个foo函数'); }方式二 匿名函数表达式> var bar = function (){> console.log('我是一个匿名函数');> }方式三 自执行函数(立即执行函数) (functi
2020-07-22 20:43:48
118
原创 冒泡排序思路
内层循环i<arr.length - 1 因为排序的最后一个不用再循环比较 for (var i = 0; i < arr.length - 1; i++) { // 比较 arr[i]和 arr[i+1] // 位置不对,就交换 if (arr[i] > arr[i + 1]) { var temp = arr[i]; arr[i] = arr[i + 1];
2020-07-22 11:27:28
161
原创 数组
创建数组的方式var arr = ['张三','李四','王五','小明'];var arr2 = new Array(3);创建出 一个数组 [empty*3],三个空元素数组 var arr3 = new Array(2,3,5); console.log(typeof arr); // object // 判断一个 变量 是不是 数组 // instanceof console.log(arr instanceof Array); // true
2020-07-21 18:25:47
138
原创 DOM核心总结
DOM对元素的操作:创建、增删改查、属性操作、事件操作。1.创建document.writeinnerHTMLcreateElement2.增appendChildinsertBefore3.删removeChild4.改修改元素属性:src、href、title等修改普通元素内容:innerHTML、innerText修改表单元素:value、type、disabled等修改元素样式:style、className5.查DOM提供的API方法:getEl.
2020-07-20 20:19:01
198
原创 DOM创建元素三种方式比较
经典面试题:创建元素效率比较: // 1.document.write()会导致页面重绘 // 2.innerHTML是将内容写入某个DOM节点,不会导致页面重绘。 // 3.innerHTML创建多个元素效率更高,(只要不采取字符串拼接,采取数组形式拼接),结构稍微复杂。 // 4.createElement()创建多个元素效率略低,但结构更清晰。 // 1.Document.write() 创建元素 如果页面文档流加载完毕, 再调用这句话会导致页面重绘
2020-07-20 17:51:06
247
原创 JS基础7/17
JS输出框类型5种alert(‘你好’); (只有确定一个按钮的警示框)prompt(‘请输入您的姓名’);confirm(‘确认提交信息吗?’); (有确定和取消两个按钮)console.log(’’); (控制台打印)document.write(’’); (在页面输出信息)转义字符\” 转双引\’转单引\n转换行\r 转回车基本数据类型5种number/string/boolean/null/undefinedES6新增 sy
2020-07-17 18:23:35
178
原创 样式属性和盒模型
新增样式属性Web字体通过 @font-face属性,可以引入外部字体文件@font-face { font-family:"bf"; src: url(bf.TTF); }字体图标将图标制作成字体包, 这样我们就可以将图标当做一个字来对待,对齐设置大小和颜色,实现图标的变色.矢量图标库文本阴影text-shadow: h-shadow(x) v-shadow(y) blur(模糊半径) color(颜色)1、水平偏移量 正值向右 负值向左2、垂直偏移量 正值向下 负
2020-07-14 18:29:20
105
原创 伪类选择器新增和伪元素-7/14
CSS3CSS3是CSS(层叠样式表)技术的升级版本,于1999年开始制订,2001年5月23日W3C完成了CSS3的工作草案,主要包括盒子模型、列表模块、超链接方式、语言模块、背景和边框、文字特效、多栏布局等模块。浏览器内核以及其前缀CSS标准中各个属性都要经历从草案到推荐的过程,css3中的属性进展都不一样,浏览器厂商在标准尚未明确情况下提前支持会有风险,浏览器厂商对新属性的支持情况也不同,所以会加厂商前缀加以区分。如果某个属性已经从草案变为了或接近推荐方案,并且厂商已经完全实现了推荐属性,那就不
2020-07-14 11:07:37
241
原创 H5新增和表单-7.13
HTML52014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,该标准规范终于制定完成HTML5,它是HTML4.0升级版,并不仅仅只是做为HTML标记语言的一个最新版本,更重要的是它制定了Web应用开发的一系列标准,成为第一个将Web做为应用开发平台的HTML语言。与传统的技术相比,HTML5 的语法特征更加明显,它定义了一系列新元素,如新语义标签、智能表单、多媒体标签等,可以帮助开发者创建富互联网应用,还提供了一些Javascript API,如地理定位、重力感应、硬件访问(页面要求访问相册
2020-07-14 11:03:44
375
原创 CSS-背景属性
背景图片属性<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> <style> body { background-image: url("img/banner.jpg"); background-repeat: no-repeat; backgrou
2020-07-06 11:39:32
160
原创 CSS-02
CSS 继承性CSSj继承性总结CSS 权重问题复杂选择器权重计算行内样式 1000id 选择器 100class 选择器 10标签选择器 1通配符/继承属性 0标签的表现形式块状标签:独占一行,宽高有效。不写宽度时,宽度是父元素(剩余)宽度的100%比如:div p h1~h6 form table hr br ul>li ol>li dl>dt/dd行内块标签:可以同一行显示,宽高有效。不写宽度时,宽度由内容支撑.比如: input select img b
2020-07-04 14:15:38
151
原创 CSS案例
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> .d0{ width: 800px; height: 600px; /*块状元素水平居中*/ margin: 0 auto; } .sp.
2020-07-03 18:52:16
108
原创 CSS基础
CSS 介绍全称层叠样式表 (Cascading Style Sheets),用于实现页面的样式。css可以用来为网页创建样式表,通过样式表可以对网页进行装饰。所谓层叠,可以将整个网页想象成是一层一层的结构,层次高的将会覆盖层次低的。而css就可以分别为网页的各个层次设置样式。基本语法CSS的样式表由一个一个的样式构成,一个样式又由选择器和声明块构成。语法:选择器 { 样式名:样式值; 样式名:样式值; }p { color:red; font
2020-07-03 18:44:02
122
原创 HTML基础
文本格式化标签在网页中,有时需要为文字设置粗体、斜体或下划线效果,这时就需要用到 HTML 中的文本格式化标签,使文字以特殊的方式显示。斜体/加粗 <em> <strong> 。em 标签用于表示一段内容中的着重点。strong 标签用于表示一个内容的重要性。斜体/加粗 <i> <b> 单纯的表示斜体/加粗,没有语义化。所以根据html5标准,当我们只想设置文本特殊显示,而不需要强调内容时就可以使用i和b标签。上标/下标 <sup&g
2020-07-03 18:22:32
79
原创 骨架标签及常用标签
<!DOCTYPE>声明文档类型,告诉浏览器以HTML5的标准去解析页面。<!DOCTYPE> 标签位于文档的最前面,用于向浏览器说明当前文档使用哪种 HTML 标准规范,必需在开头处声明文档类型,只有这样浏览器才能按指定的文档类型进行解析。<html> 标签:作用:网页的根节点。<head> 标签:作用:用于存放title,meta,style,script,link等标签。辅助浏览器解析页面,并不会在页面中展示。<title>
2020-07-03 18:01:08
365
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人