lvan-ah-CSDN博客

原创源码阅读系列03----array-last【10.27】

源码阅读系列一、is-sorted1、概述xxxxxxx2、源码解析xxxxxxxxxnode中使用is-sorted库：xxxxxxxx3、总结xxxxxxx 。。诗。。。。远方。。内容持续更新中…但行好事，莫问前程。lvan学习笔记-文章内容仅个人观点2021.10.26...

2021-10-27 11:22:29 151

原创源码阅读系列02----array-first【10.27】

源码阅读系列二、array-first1、概述array-first核心只有15行，使用到的模块详解：is-number 如果值为有限数，则返回true。array-slice 数组切片法。从开始索引到结束索引（但不包括）切片数组。is-Buffer 此模块允许您在不使用Buffer.isBuffer（包括browserify中的整个缓冲区模块）的情况下检查对象是否为缓冲区kind-of 获取值的本机类型核心代码：var isNumber = require('is-n

2021-10-27 10:42:23 223

原创源码阅读系列01----is-sorted【10.26】

源码阅读01、is-sorted1、概述is-sorted是一个精美小巧的npm库，其功能是检查数组是否已排序，在npm上周下载了为855，很火爆。2、源码解析阅读源码之前养成一个习惯，先从package.js文件读起。通过阅读可知，is-sorted库没有引入其他库。以下为核心代码：// 默认为正序排序，从小到大function defaultComparator (a, b) { return a - b}// 两个参数， array必须为数组;// comparator为函

2021-10-26 14:06:38 296

原创 Vue学习----第七天_Vuex（详细梳理）【6.13】

目录一、认识Vuex1.Vuex是做什么的？2.Vuex管理什么状态①使用Vuex统一管理状态的好处一、认识Vuex1.Vuex是做什么的？Vuex是实现组件全局转态（数据）管理的一种机制，可以方便的实现组件之间数据的共享2.Vuex管理什么状态一般情况下，只有组件之间共享的数据，才有必要存储到vuex中，对于组件中的私有数据，依旧存储在组件自身的data中即可①使用Vuex统一管理状态的好处能够在Vuex中集中管理共享的数据，易于开发和后期维护能够高效的实现组件之间的数据共享，提高开

2020-06-13 11:19:34 1009

原创 Vue学习----第六天_Promise【6.12】

目录一、认识Promise1.什么是Promise？2.网络请求的回调地狱二、Promise基本使用1.定时器的异步事件2.定时器的异步事件解析3.Promise三种状态三、Promise链式调用1.Promise链式调用2.链式调用简写四、Promise的all方法一、认识Promise1.什么是Promise？2.网络请求的回调地狱多层嵌套不易维护，通常称为回调地狱二、Promise基本使用1.定时器的异步事件2.定时器的异步事件解析resolve：是一个函数，将异步执行结果传递

2020-06-12 13:39:50 125

原创 Vue学习----第五天_Vue-Router（初步了解vue路由）【6.10】

目录一、认识路由1、什么是路由2、什么前端渲染和后端渲染3、后端路由阶段4、前端路由阶段二、前端路由的规则1、URL的hash2、HTML5的history模式01.HTML5的history模式：pushState02.HTML5的history模式：replaceState03.HTML5的history模式：go三、Vue-router基础一、认识路由1、什么是路由2、什么前端渲染和后端渲染3、后端路由阶段4、前端路由阶段二、前端路由的规则实现，路径改变，页面不刷新1、UR

2020-06-10 17:44:15 372

原创 Vue学习----第四天_Vue cli(脚手架)【6.8】

目录一、Vue CLI1.什么是Vue CLI2.Vue CLI使用前提 node3.Vue CLI使用前提 webpack3.Vue CLI使用前提 webpack二、Vue CLI21.Vue CLI2详解2.目录结构向详解一、Vue CLI1.什么是Vue CLI2.Vue CLI使用前提 node3.Vue CLI使用前提 webpack可查看上一篇内容Vue学习----第三天_webpack（学习webpack看这一篇就够了1.8w字）【6.7】3.Vue CLI使用前提 web

2020-06-08 15:30:12 435

原创 Vue学习----第三天_webpack（学习webpack看这一篇就够了1.8w字）【6.7】

一、认识webpack官方网址：https://www.webpackjs.com/1.什么是webpackwebpack是一个前端模块化打包工具2.前端模块化3.和grunt/gulp打包工具的对比grunt/gulp更强调的是自动化、定义一些任务webpack更强调模块化二、webpack安装1.webpack安装webpack为了正常运行，必须依赖node环境node环境为了正常执行代码，必须依赖其包含的各种依赖的包npm(node packages manager)包管

2020-06-07 13:52:07 3892

原创 Vue学习----第三天_模块化开发【6.4】

一、为什么需要模块化1.JavaScript原始功能

2020-06-04 17:53:04 414

原创 Vue学习----第三天_组件化开发【6.3】

一、认识组件化1、什么是组件化2.Vue组件化思想二、注册组件1.注册组件的基本步骤代码如下：<div id='app'> <my-cpn></my-cpn> </div> <script src='./js/vue.js'></script> <script> // 1.创建组件构造器对象 const cpnC = Vue.extend({ // 字符串语

2020-06-03 21:43:47 415

原创 Vue学习---第二天_v-model【6.2】

一、v-model基本使用代码如下：<div id='app'> <input type="text" v-model="message">{{message}} </div> <script src='./js/vue.js'></script> <script> const app = new Vue({ el: '#app', data: { message

2020-06-02 15:05:00 345

原创 Vue学习----第二天_阶段案例【6.1】

一、作业回顾，点击变色代码如下：<!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> .active {

2020-06-01 15:39:41 370

原创 Vue学习----第二天_循环遍历【6.1】

一、v-for使用1.v-for遍历数组代码如下：<div id='app'>  <ul> <li v-for="item in names">{{item}}</li> </ul>  <ul> <li v-for="(item, ind

2020-06-01 10:01:04 212

原创 Vue学习----第二天_条件判断【6.1】

一、v-if、v-else-if、v-else1.v-if和v-else的使用代码如下：<div id='app'> <div v-if="isShow"> <h2 v-if="true">为true显示</h2> </div> <div v-else>为false显示</div> </div> <script src='./js/vue.js'>

2020-06-01 08:01:35 181

原创 Vue学习----第二天_ES6补充、事件监听【5.31】

一、ES6补充1.let/var2.const的使用修饰常量注意一：一旦给const修饰的标识符被赋值之后，不能修改 const a = 'abc' a = 'cde'注意二：在使用const定义标识符，必须先赋值 const name;注意三：常量的含义是指向的对象不能修改，但是可以改变对象内部的属性 const obj = { name: 'why', age: 30, height: 1.88 } con

2020-05-31 20:35:02 358

原创 Vue学习----第二天_计算属性【5.31】

一、什么是计算属性代码如下：<div id='app'> <h2>{{firstName + ' ' + lastName}}</h2> <h2>{{firstName}} {{lastName}}</h2>  <h2>{{getFullName()}}</h2>

2020-05-31 09:57:37 151

原创 Vue学习----第二天_绑定属性【5.30】

本章为绑定属性一、v-bind1.v-bind介绍2.v-bind基础代码如下：<div id='app'>    <img v-bind:src="imgUrl" alt=""> <a v-b

2020-05-30 21:39:29 225

原创 Vue学习----第二天_插值操作【5.30】

本章为模板语法一、自定义模板方法一：打开VSCODE编辑器，依次选择“文件 -> 首选项 -> 用户代码片段”，会出现搜索框输入html，点击第一个html.json打开{ "Print to console": { "prefix": "vue", "body": [ "<!DOCTYPE html>", "<html lang='en'>", "", "<head>",

2020-05-30 13:32:45 210

原创 Vue学习----第一天【5.30】

一、简单认识Vuejs二、Vue.js安装三、Vue初体验1、Hello Vuejs<body>  <div id="app"> <h2>{{message}}</h2> <h1>{{name}}</h1> </div> <div>{{message}}</div> <script s

2020-05-30 08:57:25 278

原创 vue报错--Maximum call stack size exceeded超出最大调用堆栈大小，已解决

Maximum call stack size exceeded错误描述其实就是超出最大调用堆栈大小，查了很长时间，总结解决方法如下几种：1、最常见的原因就是：递归函数出错检查递归函数是否具有停止调用的判断条件，解决后，就不会有堆栈溢出了。2、路由拦截出错问题代码如下：想实现的是，路由拦截，不允许乱跳转页面router.beforeEach((to, from, next) => { if (to.path === '/login') next() const tokenStr

2020-05-24 09:54:34 36632 1

原创你还在为Eslint报错而担忧吗？有这一篇就足够了

1、错误描述：error Unnecessarily quoted property ‘xxx’ found quote-props报错详情：找到不必要的引用属性“ xxx”，引用属性解决方案： xxx没必要加引号，在文件中指定行内去掉xxx引号，刷新即可。2、错误描述：Object properties must go on a new line if they aren’t al...

2020-05-02 20:42:00 5351

原创 node.js中密码加密bcrypt(坑多)

node.js中密码加密bcrypt(坑多)配置安装环境python-（并且配置环境变量）node-gyp在命令行中下载：npm install -g node-gypwindow-build-toools下载★★★★★1、下载python网址：https://www.python.org/downloads/安装适合自己的版本配置环境变量找到本地python安装目录，复制...

2020-03-26 13:59:42 919 1

原创 css高级技巧——元素的显示与隐藏

显示元素：display:block;visibility:visible;隐藏元素：display:none;不保留位置visibility:hidden;保留位置练习-元素的显示与隐藏-土豆网<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> &l...

2020-03-26 10:41:11 169

原创 css高级技巧——垂直对齐、去除图片底侧空白

垂直对齐vertical-align：垂直对齐，只针对行内块元素或者行内元素值意思top顶线对齐middle中线对齐bottom底线对齐baseline基线对齐消除图片底侧空隙解决方法：图片添加对齐vertical-align:bottom/middle/top;防止基线对齐对块级来说display:block；<!DO...

2020-03-26 10:40:33 180

原创 css高级技巧——溢出文字省略号显示

溢出文字省略号显示问题如下：文字长度超过已规定好宽度的父盒子解决后:详细解决说明：先强制文字在一行显示，white-space:nowrap;值意思normal文字显示不开始，自动换行nowrap在一行显示不换行超出部分隐藏，overflow:hidden;元素的显示与隐藏–overflow详解设置超出文字用省略号显示，text-over...

2020-03-26 10:40:08 138

原创 css高级技巧——margin负值之美

1、负边距+定位：水平垂直居中解决绝对定位absolute、固定定位fixed，都无法使用margin:auto;实现居中问题思路：利用父级盒子的宽(高)50%，然后再左(上)自己宽(高)度的一半，实现居中效果。2、压住盒子相邻边框相邻边，边框相加变粗解决思路:如果盒子都在一行，让每个盒子外边距向左1像素既margin-left:-1px;如果盒子存在多行，盒子向左1像素向上1像素...

2020-03-26 10:39:48 240

原创 css高级技巧——滑动门

滑动门思路实现步骤:首先给a一个背景图片，然后再给span一个背景图片，调至合适宽度，以便于文字添加自动滑动a是设置左侧背景(左门)，padding-left撑开合适宽度span是设置右侧背景(右门)，padding-right撑开合适宽度因为整个导航栏都是链接，所以a要包含span因为是滑动门，左右推拉，跟文字内容多少有关，需要用文字撑开盒子，需要用行内块。常用一下格式:&...

2020-03-26 10:39:19 215

原创 css高级技巧——css三角形实现

实现效果：实现思路：用css边框可以模拟三角效果父盒子宽高为04个边框都要写，只保留需要的一边边框的颜色，其他不省略，改为transparent透明为了兼顾兼容性低版本浏览器，加上font-size:0;line-height:0;代码如下：<!DOCTYPE html><html lang="en"><head> <meta c...

2020-03-26 10:38:40 186

原创 css高级技巧——CSS精灵技术/css sprites/css雪碧

CSS精灵技术/css sprites/css雪碧为什么需要精灵技术？有效的减少服务器接收和发送请求的次数，提高页面的加载速度精灵技术怎么实现？css精灵图是将网页中的一些背景图像整合到一张大图中(称为精灵图)，各个网页元素通常只需要精灵图中的不同位置的某个小图精灵技术详细实现？利用background: url(images/index.png) no-repeat 0 -107px...

2020-03-26 10:37:42 167

weixin_43848802的博客