- 博客(16)
- 收藏
- 关注
RSS订阅原创 webpack基本使用
安装方式 运行npm i webpack -g全局安装webpack，这样就能在全局使用webpack的命令 特点，装过一次以后就都不用装了 在项目的根目录中运行npm i webpack --save-dev安装到项目依赖中 创建项目 总项目下创建dist文件夹和src文件夹 dist目录代表发布完成之后的产品级的内容 src下创建css、js、images文件夹 src下创建index.html，代表项目的首页 .
2021-08-06 16:54:47
90
原创 Vue响应式原理
Vue源码–解读vue响应式原理：Vue的官方说明里有深入响应式原理这一节。在此官方也提到过：当你把一个普通的 JavaScript 对象传给 Vue 实例的 data 选项，Vue 将遍历此对象所有的属性，并使用 Object.defineProperty 把这些属性全部转为 getter/setter。Object.defineProperty 是 ES5 中一个无法 shim 的特性，这也就是为什么 Vue 不支持 IE8 以及更低版本浏览器的原因。Object.defineProperty
2021-02-21 21:06:47
1230
原创 Css实现垂直居中的几种方法
Css实现垂直居中垂直居中是布局中十分常见的效果之一，为实现良好的兼容性，方法1：绝对定位和负边距.box3{position:relative;}.box3 span{ position: absolute; width:100px; height: 50px; top:50%; left:50%; margin-left:-50px;
2021-02-15 17:16:20
195
原创 ES6中的Promise解析
Promise的作用：在js中主要是解决回调地狱什么是回调地狱？回调地狱就是我们异步任务中嵌套异步任务一层一层的，导致我们的代码臃肿，而promise链式调用解决这种代码问题。什么时候使用Promise:一般有异步操作时，使用Promise对这个异步进行封装。异步操作后的三种状态：Pending：等待状态。Fulfill:满足状态，主动调用resolve，就处于该状态。Reject:拒绝状态。调用reject时，就处于该状态。ES6封装好的Promise var
2021-02-06 16:23:14
77
原创 vue生命周期钩子函数详解
详解：1- beforeCreate官方说明：在实例初始化之后，数据观测(data observer) 和 event/watcher 事件配置之前被调用。解释：这个时期，this变量还不能使用，在data下的数据，和methods下的方法，watcher中的事件都不能获得到； beforeCreate() { console.log(this.page); // undefined console.log{this.showPage); // undefined }, data..
2021-02-05 09:18:13
82
原创 CSS3媒体查询
css3媒体查询主要包含两个方面：媒体类型 函数什么是媒体查询媒体指的就是各种设备 (移动设备, PC设备) 查询指的是要检测属于哪种设备 媒体查询: 通过查询当前属于哪种设备,让网页能够在不同的设备下正常的预览学习媒体查询的核心是什么?实现页面在不同设备下正常预览 [判断当前设备]@media all and (min-width:800px)and (orientation:landscape) {…//样式}解释：all (所有的设备)print (打印设备)
2021-01-31 15:45:54
241
原创 vue-router中的exact作用
exact类型: boolean默认值: false“是否激活”默认类名的依据是包含匹配。 举个例子，如果当前的路径是 /a 开头的，那么 也会被设置 CSS 类名。按照这个规则，每个路由都会激活 ！想要链接使用“精确匹配模式”，则使用 exact 属性：<!-- 这个链接只会在地址为 / 的时候被激活 --><router-link to="/" exact></router-link>目前唯一用到的场景是 导航 切换问题, 切换到别的路由的时候
2021-01-29 22:12:06
2173
原创 浅谈Css3两种盒模型
盒模型的分类W3C盒子模型（标准的盒模型）宽度和高度的计算标准盒模型：width = content-widthheight = content-heightIE盒模型（怪异盒模型）怪异盒模型:width = content-width + padding-width + border-widthheight = content-height + padding-height + border-height如何在CSS 设置这两个模型标准盒模型：box-sizing
2021-01-25 14:11:28
85
原创 关于闭包的作用
闭包：内部函数保存到外部当内部函数被保存到外部时，将会生成闭包。闭包会导致原有作用域链不释放，造成内存泄漏（内存占用）闭包的作用实现公有变量： eg：函数累加器可以做缓存（存储结构）：eg:eater可以实现封装，属性私有化：eg:new Person();模块化开发，防止污染全局变量白话概述私有变量：内部函数访问了外部函数的变量，然后外部函数再把这个函数抛出，抛出的结果是操作器，供外部使用...
2021-01-24 16:42:39
60
原创 JS基础心法—call apply bind
call 、apply、 bind这三个方法有什么区别呢？分别适合应用在哪些场景中呢？先举个简单的栗子 ~var person = { name: "axuebin", age: 25};function say(job){ console.log(this.name+":"+this.age+" "+job);}say.call(person,"FE"); // axuebin:25 FEsay.apply(person,["FE"]); // axuebin:25 FEvar
2021-01-24 16:03:45
100
原创 CSS3 的圣杯布局和双比翼布局
CSS 三栏布局（圣杯布局与双飞翼布局）三栏布局的概念：三列从左到右，依次排列，左边区域和右边区域固定宽，而中间内容区域宽度自适应。圣杯布局： 1.浮动 2.margin负值HTML<div class="werppar"> <div class="container"></div> <div class="left"></div> <div class="right"><
2021-01-21 14:46:08
223
原创 猜数字小游戏
1-50之间随机生成一个整数，让用户输入一个数字注：只有10次机会！！！！1.若用户输入的数大于该数字。就提示您猜大了，继续猜。2.若用户输入的数小于该数字。就提示您猜小了，继续猜。3.如果等于，提示猜对了，并且结束程序。 function get(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; } var bb = get(1, 50);
2020-11-21 20:19:00
208
原创 创建对象方式
在JavaScript中，现阶段我们采用三种对象创建对象：函数声明利用字面量创建对象（函数表达式）构造函数（new Function）1.函数声明： //函数声明 function obj(a,b) { alert(a + b); }2.函数表达式：var 函数名 = function([形参1,形参2...]){ * 语句.... * }3.构造函
2020-11-21 10:15:24
67
原创 预解析的变量提升
预解析分为：1.变量预解析：变量提升，不提升复制操作2.函数预解析：函数提升，不调用函数案例1var a = 18;f1();function f1() { var b = 9; console.log(a); console.log(b); var a = 13;}相当于执行了以下代码：var a;function f1() { var b; var a; b = 9; console.log(a); //u
2020-11-20 20:16:36
152
原创 Flex 移动端携程网
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="./css/normalize.css"> <link rel="sty.
2020-11-17 19:18:48
124
原创 CSS3旋转木马案例
<section> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> </section>body { persp..
2020-11-14 13:37:22
101
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人