- 博客(66)
- 资源 (1)
- 收藏
- 关注
RSS订阅
原创 Express这些中间件还没掌握的话赶紧学习起来啦！【持续更新中】
目录1、导读2、什么是中间件2.1中间件的构成2.2中间件的处理方式3.应用层级中间件3.1app.METHOD()3.2 app.use()4.路由器层中间件5.错误处理中间件6.内置中间件7.第三方中间件post请求解析跨域中间件 corsmysql数据库查询MD5加密 cryptoexpress-validator 表单验证JWT 解析 express-jwt1、导读学了Express...
2020-04-07 13:58:05
2376
33
原创 入门Vuex看这篇就够了
文章目录1.Vuex 概述1.1传统组件之间的传值方式1.2Vuex 是什么1.3使用 Vuex 统一管理状态的好处1.4什么情况下我应该使用 Vuex？2.Vuex的使用3.Vuex 的核心概念3.1 State3.1.1组件访问 State 中数据的第一种方式：3.1.2组件访问 State 中数据的第二种方式：3.2 Mutation3.3Action3.3.1触发 actions 异步任务...
2020-03-17 00:17:20
706
24
原创 踩坑记录_vant图标字体不生效，显示成小方框□
在使用van组件库的时候，采用的官方推荐的自动按需引入方式。结果发现官方的图标字体一直都不生效，显示成小方框□。查询资料的时候大多说的是再才导入样式即可，可是发现还是不行。最终在看样式的时候发现图标字体变成了这个，和正常显示的font并不一样。最终发现是在引入Reset CSS格式化浏览器默认样式代码的问题。这将会导致vant的默认图标字体全部进行更改，从而没有效果。当然，所以你可以选择将格式化字体样式的代码删除，或者这里也推荐使用normalize.css进行浏览器默认样式的清除。采用自动
2020-11-06 18:03:07
3437
原创 ECMAScript2020 可选链操作符（?.）的应用
一、前言 const programmer = { user: 'lin', department: { name: '技术部', getSite() { return '***' } } }在以前的语法中，想要获得深层次的属性或方法，如果不做前置校验的话，那么就很容易出现这种错误↓ 这可能会导致你整个应用奔溃…二、如果是你的话会以怎
2020-10-28 18:03:17
1868
4
原创 教你几招前端中的高级操作，你知道几种？
目录一、类型装换1.快速转Number2.快速转 Boolean3.混写二、连续解构1.最基本的解构2.解构嵌套对象一、类型装换1.快速转Numbervar a = '1'console.log(typeof a)console.log(typeof Number(a)) // 普通写法console.log(typeof parseInt()a) // 普通写法console.log(typeof +a) // 高端写法2.快速转 Booleanvar a = 0console.
2020-06-01 15:20:54
3652
2
转载 js判断是否为对象的几种方法
var obj = {}；1、toString（推荐）Object.prototype.toString.call(obj) === '[object Object]'2、constructorobj.constructor === Object3、instanceof 需要注意的是由于数组也是对象，因此用 arr instanceof Object 也为true。obj ins...
2020-04-28 14:21:57
13512
2
原创 Node 生成 JWT Token的使用方法
Token 是什么Token 本质就是是字符串，用于请求时附带在请求头中，校验请求是否合法及判断用户的身份。Token 与 Session、Cookie 的区别Session 保存在服务端，用于客户端与服务端连接时，临时保存用户信息，当用户释放连接后，Session 将被释放；Cookie 保存在客户端，当客户端发起请求时，Cookie 会附带在 http header 中，提供给服务端...
2020-04-05 01:46:07
1692
原创 【记录】vue项目中@import 后面的波浪号~ 代表什么意思
在使用vue-element-admin框架的时候，发现原来导入样式也可以这也写！写法挺高级的，就此记录下~由于是在webstorm中编写的项目，编辑器好像不识别这种写法，所以一直报错。这种写法其实是webpack中的一个配置。这里用~符号,表示后面的值为 alias, 然后就会去vue.config.js的 alias 配置中找相应的值。然后拼接成最后的地址：'src/styles/...
2020-03-30 22:43:56
2491
原创 Vue项目配置代码格式化工具
1.为什么要用Prettier用来替代lint中的一些场景，比如说分号/tab缩进/空格/引号，这些在lint工具检查出问题之后还需要手动修改，而通常这样的错误都是空格或者符号之类的，这样相对来说不太优雅，利用格式化工具自动生成省时省力。2.配置过程在项目根目录创建一个 .prettierrc文件文件中添加所需要的规则，如将分号;进行去除（semi），或者将双引号改为单引号(singl...
2020-03-13 00:03:33
3685
2
原创 Vue项目优化——通过 externals 加载外部 CDN 资源
1.发现项目中存在的问题为了直观地发现项目中存在的问题，我们可以在打包时生成报告。我们可以通过VueCli可视化的UI面板运行bulid直接查看报告。而在报告中我们发现了有这么一个文件，体积比较大，这样可能会造成我们较长时间的请求。2.那么这个文件是怎么来的呢？它的作用是什么？原来，其实默认情况下，项目中我们通过 import 语法导入的第三方依赖包，最终会被打包合并到同一个文件中，而这...
2020-03-09 16:33:05
3080
3
转载 CDN通俗易懂简介，再看不懂，可能不适合当程序员
CDN，相信你对这个名词一点也不陌生，经常我们会说，把某些文件图片上传到CDN，那样子用户访问会更快，那什么是CDN呢？CDN全称为内容分发网络（Content Delivery Network），它是有美国麻省理工学院的学生发明的，最大的作用的就是缓存用户相对集中的资源，一般这类资源都是不可变的，例如图片、视频、音频文件等。这与我们一般的服务器又有什么区别呢？网络不是四通八达的么？为什么需要CD...
2020-03-08 21:00:46
1591
3
原创 填坑记录之Vue中v-model与:model区别
初做vue项目中遇到这个问题，记录一下。源代码：打算做的表单验证功能。结果发现在验证的过程中username规则的第一条正确了却一直通过不了。通过控制台得知长度一直为1。原来是拿不到数据。v-model通常用于input的双向数据绑定,它并不会向子组件传递数据。:model是v-bind:model的缩写，是绑定自定义属性.它只是将父组件的数据传递给子组件，并没有实现父组件和子组...
2020-02-15 20:43:46
1261
1
原创 报错信息记录——Vue组件模板只能有一个根元素
报错信息Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead.报错分析编译模板错误。组件模板应该只包含一个根元素。在一个组件模板中应该只存在一个根元素，所以在每个组...
2020-02-09 15:13:55
1029
原创 ES6 Promise用法总结
目录：一、Promise概述二、使用Promise的好处三、Promise基本用法四、基于Promise发送Ajax请求五、Promise 基本API实例方法.then().catch().finally()静态方法.all().race()一、Promise概述简单的来讲，Promise就是异步编程的一种解决方案。从语法上讲，Promise是一个对象，从它可以获取到异步操作的消息。二、使...
2020-02-08 18:30:35
1081
原创 axios用法总结
目录：一、axios的优点二、axios基础用法三、axios 全局配置四、axios 拦截器一、axios的优点基于promise用于浏览器和node.js的http客户端支持浏览器和node.js支持promise能拦截请求和响应自动转换JSON数据能转换请求和响应数据二、axios基础用法get和 delete请求传递参数通过传统的url 以 ? 的形式传递参数...
2020-02-07 22:54:23
1084
转载 Node.js自动重启工具 nodemon
为什么要使用在编写调试Node.js项目，修改代码后，需要频繁的手动close掉，然后再重新启动，非常繁琐。现在，我们可以使用nodemon这个工具，它的作用是监听代码文件的变动，当代码改变之后，自动重启。如何使用nodemon下载npm install -g nodemon-g 代表全局安装，代表所有项目无论有没安装 nodemon，都可以直接在命令行上运行，因此我们不会在项目里...
2020-02-06 23:48:47
378
原创 Vue中$event的用法
因为在Vue API文档里$event的用法找不到，所以我自己总结了一下。通常的用法是用来获取当前元素的最新值。$event.target.value <body> <div id="app"> <input type="text" @click="abc($event)" value="123" /> </div>...
2020-02-05 21:25:10
16951
7
原创 Vue入门指南——数组变异方法
一、数组变异方法在 Vue 中，直接修改对象属性的值无法触发响应式。当你直接修改了对象属性的值，你会发现，只有数据改了，但是页面内容并没有改变变异数组方法即保持数组方法原有功能不变的前提下对其进行功能拓展push()往数组最后面添加一个元素，成功返回当前数组的长度pop()删除数组的最后一个元素，成功返回删除元素的值shift()删除数组的第一个元素，成功返...
2020-01-28 13:15:27
985
原创 Vue入门指南——1张图搞懂生命周期！
目录：一、什么是生命周期?二、图解一、什么是生命周期?从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的事件，这些事件，统称为生命周期！生命周期钩子：就是生命周期事件的别名而已；生命周期钩子 = 生命周期函数 = 生命周期事件二、图解如果您也正在学习前端的路上，记得关注该博主，学习更多关于前端的知识~博主主页 Poetic Code...
2020-01-28 01:12:56
617
原创 Vue入门指南——过滤器
目录：一、过滤器的作用是什么？二、自定义全局过滤器三、 全局过滤器的使用四、局部过滤器五、带参数的过滤器六、带参过滤器的使用七、注意事项一、过滤器的作用是什么？格式化数据，比如将字符串格式化为首字母大写，将日期格式化为指定的格式等二、自定义全局过滤器过滤器中的 function 里的第一个参数，已经被规定死了，永远都是 过滤器 管道符前面传递过来的数据。Vue.filter(‘过滤器名称...
2020-01-28 00:06:15
984
4
原创 Vue入门指南——侦听器
目录：一、什么是侦听器？二、侦听器的应用场景三、侦听器的用法四、注意事项一、什么是侦听器？侦听器是用来检测数据变化从而来添加执行自己自定义逻辑的代码（数据一旦发生变化就通知侦听器所绑定方法 ）。这一点和计算属性很相似,然而计算属性一般作用于简单的一些小逻辑代码,如果逻辑比较复杂可以使用侦听器。二、侦听器的应用场景一般用于异步或者开销较大的操作（如 ajax，计时器等一些耗时操作）三、...
2020-01-27 22:01:10
1304
原创 Vue入门指南——计算属性
目录：1. 为何需要计算属性？2. 计算属性的用法3. 计算属性与方法的区别4.小案例1. 为何需要计算属性？表达式的计算逻辑可能会比较复杂，使用计算属性可以使模板内容更加简洁2. 计算属性的用法computed: { reversedMessage: function () { return this.msg.split('').reverse().join('') ...
2020-01-27 00:26:43
1841
原创 Vue入门指南——分支结构
目录：一、v-if二、v-else-if & v-else三、v-show四、v-show 和 v-if的区别五、总结一、v-ifv-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 true 值的时候被渲染。<div id="app"> <!-- 判断是否加载，如果为真，就加载，否则不加载--> <...
2020-01-22 19:55:13
2126
原创 Vue入门指南——自定义全局指令和局部指令
目录：一、简介二、如何自定义指令1.自定义全局指令2.自定义局部指令三、以传参的方式进行指令设置四、函数简写一、简介当开发需求做一个自动获取焦点事件的时候，我们最原生的做法就是通过获取元素来注册事件,document.getElementById("search").focus();然而在vue中并不提倡我们直接操作DOM元素。那我们该怎么办呢？这时候就需要我们自定义指令来实现这个功能了...
2020-01-20 16:54:34
1738
转载 PHP中的替代语法
我们经常在wordpress一类博客程序的模板里面看到很多奇怪的PHP语法，比如：<?php if(empty($GET_['a'])): ?> <font color="red">空的</font><?php endif; ?>对于相当一部分PHP爱好者来说根本没见过，这些是什么东西呢？其实这些都是PHP流程控制的替代语法，只不过不常...
2019-10-26 15:50:24
566
原创 快速上手Ajax【一篇文章就搞懂】【2】
目录：4.原生Ajax封装5. jQuery 中的 AJAX5.1 $.ajax5.2 $.get5.3 $.post5.4 全局事件处理4.原生Ajax封装/*** 发送一个 AJAX 请求* @param {String} method 请求方法* @param {String} url 请求地址* @param {Object} params 请求参数* @param {Fun...
2019-10-24 13:28:00
6333
11
原创 快速上手Ajax【一篇文章就搞懂】
目录：1.什么是 AJAX ？2.快速上手2.1 AJAX工作流程图2.2 readyState 和status3. 具体用法3.1 GET 请求3.2. POST 请求3.3选择GET还是POST？3.4 同步与异步1.什么是 AJAX ？AJAX = 异步 JavaScript 和 XML。AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使...
2019-10-20 12:47:22
20571
35
原创 window环境下composer的安装教程(exe程序安装失败的请看这)
Composer是 PHP 用来管理依赖（dependency）关系的工具。你可以在自己的项目中声明所依赖的外部工具库（libraries），Composer 会帮你安装这些依赖的库文件。但是有有些小伙伴在官方给的 Composer-Setup.exe安装中出现失败问题，可能是应为Composer的镜像在国外，由于网络的问题，导致在官网下载安装后最终无法成功安装。一、解决办法：在PHP目...
2019-10-13 16:58:01
1155
原创 PHP中include()与require()的区别
requirerequire_onceincludeinclude_once1.require 和 include共同点：都可以在当前 PHP 脚本文件执行时载入另外一个 PHP 脚本文件。2.require 和 include 不同点：当载入的脚本文件不存在时，require 会报一个致命错误（结束程序执行），而 include 不会3.有 once 后缀的特点：判断当前载...
2019-10-10 18:36:52
3183
原创 【分享】JavaScript中几套比较流行的代码风格
一、Airbnb JavaScript 风格指南这是由 Airbnb 开源的 JavaScript 代码风格指南。主要是为编写 JavaScript 代码提供规范的风格，方便开发者理解、阅读代码。在github上已经接近有90,000+Star,18,000+fork了。是目前比较流行的一套 前端开发流程规范。github原文地址： https://github.com/airbnb/java...
2019-10-04 23:07:08
741
原创 Web前端开发——BAT面试题汇总及答案04（持续更新中）
目录：一、前言二、JS 基础篇26、要将页面的状态栏中显示“已经选中该文本框”，下列 JavaScript 语句正确的是（ A ）27、以下哪条语句会产生运行错误：（A）28、以下哪个单词不属于 javascript 保留字：（B）29、请选择结果为真的表达式：（C）30、分析代码，得出正确的结果。31、写出函数 DateDemo 的返回结果，系统时间假定为今天32、 写出程序运行的结果33、截取...
2019-09-21 09:08:45
1834
原创 jQuery中mouseenter和mouseover的区别
mouseover鼠标覆盖，不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。mouseenter鼠标进入，只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。mouseenter和mouseover示例可以从W3School的示例代码可以看出，mouseenter是穿过，所以只能触发一次事件，而mouseover是位于元素上方，可以触发多次事件。如...
2019-09-11 21:18:30
562
原创 Web前端开发——BAT面试题汇总及答案03（持续更新中）
目录：一、前言二、JS 基础篇5、JavaScript this 指针、闭包、作用域6、事件委托是什么7、闭包是什么，有什么特性，对页面有什么影响8、如何阻止事件冒泡和默认事件9、添加 删除 替换 插入到某个接点的方法10、javascript 的本地对象，内置对象和宿主对象11、document load 和 document ready 的区别12、、”== ”和“===”的不同13、已知 I...
2019-09-08 14:46:08
7304
6
原创 Web前端开发——BAT面试题汇总及答案02（持续更新中）
目录：一、前言二、HTML&CSS篇：21、css 中可以让文字在垂直和水平方向上重叠的两个属性是什么？22、px 和 em 的区别。23、描述一个”reset”的 CSS 文件并如何使用它。知道 normalize.css 吗？你了解他们的不同之处？24、display:none 与 visibility:hidden 的区别是什么？25、CSS 中 link 和@import 的区别是...
2019-09-07 12:10:07
675
转载 清除浏览器默认样式normalize.css源代码
normalize.css文件一般用于重置一些浏览器默认的样式，只要将html文件应用该css文件即可实现。normalize.css里面的源码：/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css *//*http://necolas.github.io/normalize.css/*//*...
2019-09-07 11:33:28
1359
原创 Web前端开发——BAT面试题汇总及答案01（持续更新中）
目录：一、前言二、HTML&CSS篇：1、你做的页面在哪些流览器测试过？这些浏览器的内核分别是什么?2、每个 HTML 文件里开头都有个很重要的东西，Doctype，知道这是干什么的吗？3、div+css 的布局较 table 布局有什么优点？4、 img 的 alt 与 title 有何异同？ strong 与 em 的异同？5、为什么利用多个域名来存储网站资源会更有效？6、请谈一下你对...
2019-09-04 19:59:00
11523
6
原创 js中的继承方式
目录：一、前言二、继承的几种方式1.借用构造函数继承(该方式主要解决属性的问题)一、前言面向对象特性:封装,继承,多态。继承,类与类之间的关系,面向对象的语言的继承是为了多态服务的。js不是面向对象的语言,但是可以模拟面向对象.模拟继承.为了节省内存空间。在js中我们可以通过原型来进行继承，它的原理是改变原型的指向。原型的两个作用：原型作用1: 数据共享 ，目的是:为了节省内存空间,...
2019-09-04 12:52:35
1536
原创 js的offset、client、scroll三大系列
1.offset系列——用来获取元素的宽，高，left，top，offsetParent。它的值包括父级元素margin+父级元素padding+父级元素border+自己的margin1.1 offsetLeft：元素距离左边位置的值1.2 offsetTop: 元素距离上面位置的值1.3 offsetWidth : 获取元素的宽度（有边框）1.4 offsetHeight:获取元素...
2019-09-03 07:34:30
375
原创 原生js实现贪吃蛇大作战案例
贪吃蛇大作战面向对象的编程思想：地图: 宽，高，背景颜色，因为小蛇和食物都是相对于地图显示的,这里小蛇和食物都是地图的子元素,随机位置显示,脱离文档流的,地图也需要脱离文档流–css需要设置:宽,高,背景颜色,脱标。食物—div元素elements—>存储div的数组(将来删除的食物div时候,先从map中删除div,再从数组中移除div)食物:宽,高,背景颜色,横坐标,纵坐标一个...
2019-09-02 12:55:37
903
原创 去除inline-block元素间间距的方法
目录：一、现象描述二、解决方法方法1：各元素间不留任何空格方法2：使用margin负值方法3：在父元素上设置font-size:0方法4：使用letter-spacing或者word-spacing一、现象描述inline-block是一个块状行盒，表现为一个行内元素，它既拥有了块状元素可以设置width和height的特性，又保留了行内元素不换行的特点。 而当我们去使用它时候会发现各元素之间...
2019-09-02 07:25:10
11603
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人