- 博客(49)
- 收藏
- 关注
RSS订阅原创 element分页器页码不高亮
问题记录：使用element表格分页器时，从后端请求数据时，未查到时返回数据result为null，因此分页器中的total被赋值为undefined，当再次请求得到数据时，页码没有选中高亮。解决：对请求数据做容错处理，没有查到数据时给total赋值为0即可。this.tableData = result.list || [];this.total = result.total || 0;...
2022-02-21 16:18:52
925
1
原创 [Vue warn]: Error in nextTick: “TypeError: Cannot read property ‘map‘ of null“
[Vue warn]: Error in nextTick: "TypeError: Cannot read property 'map' of null"
2021-07-30 20:07:47
5879
1
原创 JavaScript之防抖、节流设计实现
关于防抖和节流：在频繁的事件回调中做复杂计算，很有可能造成页面卡顿，此时可以将多次计算合并为一次计算，只在一个精确点做操作。防抖和节流都是防止函数多次调用 区别在于：防抖会在每次触发后重新计时，直到到达指定时间间隔节流是相隔指定时间再执行防抖：其实防抖的原理很简单，看完下面这个生活应用场景就已经非常清晰了生活中最常见的就是电梯，关门机制：当有人进入电梯就重新计时等待指定的间隔时间。防抖就是只要有事件进来就重新计时，如果一直触发这个事件并且间隔小于指定时间间隔，就一直不能执行，只有这次事件进
2021-04-29 17:02:24
139
原创 JavaScript之new、instanceof的模拟实现
1. new关键字的实现创建一个空对象，作为将要返回的对象实例将这个空对象的原型，指向构造函数的prototype属性将这个空对象赋值给函数内部的this关键字开始执行构造函数内部的代码执行结果如果是引用类型就返回执行结果 否则返回对象function _new(FC, ...args) { if (typeof FC !== "function" || !FC.prototype) throw Error("error") var obj = Object.create(
2021-04-27 22:45:34
129
原创 JavaScript之call、apply、bind的模拟实现
1. call的实现call()方法调用一个函数，其具有一个指定的this值和分别地提供的参数（参数的列表）。call的性能要高于apply。call()方法作用和apply()方法类似，只有一个区别，就是call()方法接受的是若干个参数的列表，而apply()方法接受的是一个包含多个参数的数组。语法：function.call(thisArg, arg1, arg2, ...) // 思路：判断this是否传递，参数是否存在，删除创建的函数 // 原理：把当前
2021-04-27 22:36:19
102
原创 PHP连接mysql8.0版本报错：mysql_connect():The server requested authentication method unknown to the client
原因：mysql8.0使用caching_sha2_password进行身份验证，PHP需要改为mysql_native_password才可以使用。在命令行通过mysql_native_password方式修改一下密码就可以了：# 修改用户的密码 密码使用自己的密码，默认密码是rootALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'password'; FLUSH PRIVILEGES; #刷新权限.
2021-04-13 13:28:39
754
原创 javascript数组方法及其重构
Array方法及其重构创建数组：直接创建：var arr = [ 1,2,3 ]创建数组对象：var arr = new Array(size)var arr = new Array(1,2,3)根据对象创建数组： var arr = new Object([])清空数组：arr.length = 0使用in运算符可以判断数组元素是否为空var arr = [1,2,3,,4];3 in arr // false 0 in arr // true // 数字3和0 表示
2021-03-25 22:15:36
489
原创 vue+node项目中使用token进行登录验证拦截
在vue+node项目中使用token进行登录验证拦截：一、用户登录发送登录请求到后台二、后台接收用户发送的登录请求，进行验证用户登录。验证成功后生成token并响应给前台。三、前台接收到后台的token信息和用户其他信息，将token信息存储到localstorage。四、前台拦截请求，将token信息添加到请求头中。五、后台拦截前台的每次请求，进行验证token信息是否存在和正确。并且响应信息给前台。六、前台根据后台的响应确定token是否正确，进行进一步操作（不正确，跳转至登录页面）。
2021-03-21 17:37:07
1517
原创 JS——数据类型和类型转换
1.数据类型和类型转换- 数值（number）：整数和小数- 字符串（string）：文本- 布尔值（boolean）：表示真伪的两个特殊值，true和false- undefined：表示“未定义”或不存在，没有任何值- null：表示空值，值为空- 对象（object）：各种值组成的集合- Symbol：ES6新增，表示独一无二的值，最大的用法是用来定义对象的唯一属性名。原型数据类型和引用数据类型两大类。类型转换##转Boolean：在条件判断时，除了undefined，nu
2021-03-17 08:22:07
581
原创 node后台通过multer接收vue+elementui上传的图文表单
前端代码：由于图片和其他内容无法一起提交，new一个新的formDate对象，使用append将图片文件和其他内容加到新的formDate对象，传递给后台。后台从req.body和req.file获取。<el-form @submit.native.prevent="saveImage" ref="form" :model="image" label-width="80px" > <el-form-item label="图文标题"> &l
2021-03-10 22:13:05
472
1
原创 css浮动与清除浮动
**浮动：**使元素脱离文档流，按照指定的方向（左或右发生移动）。知道它的外边缘碰到包含框或另一个浮动框位置。float: left|right|none;当元素浮动后，不会影响块级元素的布局，只会影响内联元素布局。此时文档流中的普通流流就会表现得该浮动框不存在一样的布局模式。当包含框的高度小于浮动框的时候，此时就会出现“高度塌陷”。清除浮动：清除浮动是为了清除使用浮动元素产生的 影响。浮动的元素，高度会塌陷，而高度的塌陷使页面后面的布局不能正常显示。清除浮动的两种方式：使用clear属性
2021-03-09 08:36:51
222
原创 margin-top传递问题
在包含结构里，给子元素添加margin-top，正常情况是子元素下来，但是在浏览器解析时，会把这个上外边距传递给父元素，父元素也会下来。解决方法：给父元素添加overflow: hidden;溢出隐藏给父元素添加边框border-top: 2px solid transparent;给父元素或子元素添加浮动float: left;...
2021-03-09 08:20:44
418
原创 css选择器
id选择器（#app）类选择器（.top）标签选择器（span）后代选择器（div p）子选择器（div>p）兄弟选择器（div~p）相邻属性选择器（div+p）属性选择器（input[type=“password”]）伪类选择器（a:hover）10.伪元素选择器（::after）通配符选择器（*）群组选择器（div, p）...
2021-03-09 08:14:20
87
原创 CSS引入方式
CSS ： cascading style sheet 层叠样式表行内式——在标签style属性中直接使用<div style="height=30px;"></div>嵌入式——使用style标签书写css代码<style> p { font-size: 12px; }</style>style标签一般放在head标签内部链接式——使用link标签引入css文件<link rel="stylesheet" typ
2021-03-09 08:08:22
189
原创 页面缩放造成元素塌陷
浏览器页面缩小致使设置浮动的元素在一行内放不下，造成塌陷。原页面：缩小后：检查发现，元素的border在缩小页面后由1px变为2px从而导致一行放不下而另起一行。将元素盒模型设置为border-box即可解决。box-sizing: border-box;...
2021-03-02 14:58:01
1045
原创 axios的使用和配置
Axios 是一个基于 Promise 的 HTTP 库，可以用在浏览器和 node.js 中。从浏览器中创建 XMLHttpRequest从 node.js 发出 http 请求支持 Promise API拦截请求和响应转换请求和响应数据取消请求自动转换JSON数据客户端支持防止 CSRF/XSRF请求时使用 application/x-www-form-urlencodedaxios 会默认序列化 JavaScript 对象为 JSON。 如果想使用 application/x-ww
2020-11-30 09:09:15
388
原创 get和post的使用情景和区别
向服务器发送请求与 POST 相比，GET 更简单也更快，并且在大部分情况下都能用。然而，在以下情况中，请使用 POST 请求：无法使用缓存文件（更新服务器上的文件或数据库）向服务器发送大量数据（POST 没有数据量限制）发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠若符合下列任一情况，则用POST方法：请求的结果有持续性的副作用，例如，数据库内添加新的数据行。若使用GET方法，则表单上收集的数据可能让URL过长。要传送的数据不是采用7位的ASCII编码。若符合下
2020-11-30 08:44:19
201
原创 axios的get与post请求
get请求：getMailCode (email) { return axios.get('/users/getMailCode', { // get方式参数放在params params: { email } }) }post请求：register (options = {}) { return axios.post('/users/register', options) }后台接收：get：router.
2020-11-29 22:50:27
334
原创 express使用multer上传数据和图片信息
express项目中使用mongoose通过npm中间件multer上传文章信息以及图片地址将上传的信息存进数据库image.js引入multer中间件声明multer对象uploadvar express = require('express')var router = express.Router()var multer = require('multer')var image = require('../db/models/imageModel')var storage = m.
2020-11-21 23:13:07
495
原创 使用apidoc时，和引入其他模块的注释冲突
错误原因：上图为项目的目录结构：一开始使用命令：apidoc -i ./ -o ./apidoc项目报错，是因为使用 -i ./命令是给所有目录生成apidoc，而node_modules下有项目的其他代码的注释引起冲突。所以，将命令改为：apidoc -i ./routes -o ./apidoc 这样就是将./routes下的注释生成apidoc并放置在./apidoc目录下，如需将其他目录下的注释生成apidoc修改命令中的-i 路径即可。...
2020-11-20 20:43:30
165
原创 Node.js学习记录一
Node.js特点事件驱动异步、非阻塞I/O性能出众单线程由于Node.js是建立在V8引擎之上的，也就意味着Node.js的语法几乎与JavaScript语法一致。JavaScript是一门直译式、弱类型的脚本语言，也是web开发最重要的语言之一。JavaScript由ECMAScript、DOM（文档对象模型）、BOM（浏览器对象模型）三部分组成。JavaScript的基础回顾：1，变量：变量提升机制2， 数据类型：简单性数据类型：undefined、boolean、number
2020-11-11 21:36:38
73
原创 vue项目中@touchstart绑定的点击事件点击穿透的解决
在vue项目练习时，在一个详情页通过@touchstart绑定了一个点击返回按钮，通过history.back进行返回。但是，bug出现了，点击事件似乎并不是只执行了一次，而是在返回之后的页面又一次的进行了点击，导致效果出现极大偏差。原来代码是这样的：methods: { handleToBack () { history.back() } }最终通过定时器给点击事件一个延迟：handleToBack () { setTimeout(() =&
2020-11-10 21:39:27
2541
原创 在vue项目中创建二级动态路由
在vue项目中实现二级动态路由的跳转：<div @click="handleToDetail(type, id)" :type="type" :key="id"> 内容</div>script代码：methods: { handleToDetail (type, id) { // 编程式导航 this.$router.push('/detail/' + type + '/' + id) } }router.js代码：ex
2020-11-10 21:18:56
817
原创 小白第一次使用git仓库记录
1，在GitHub创建一个远程仓库，使用New repository填好仓库名称后，点击create repository2，在本地项目的根目录中右键打开Git Bash，使用git init初始化本地仓库。3，添加远程仓库 git remote add future + 地址，(本地仓库与远程仓库的关联)。future 为远程主机名（仓库名），可自定义，对应地址有HTTPS和SSH两种方式，推荐使用SSH方式此处易出现以下情况：关于ssh秘钥权限被拒绝的解决方案：关于SSH秘钥权限被拒绝
2020-10-29 22:48:55
238
原创 Vue cli项目中使用swiper时分页器和导航失效
原本是这样导入的：import 'swiper/swiper-bundle.min.css'import Swiper from 'swiper'但是运行效果中并没有看到分页器，导航键也是没有效果使用的swiper版本："swiper": "^6.3.4"通过各种方法的尝试最终成功解决：import 'swiper/swiper-bundle.min.css'import Swiper, { Pagination, Navigation } from 'swiper'Swiper.us
2020-10-21 12:33:14
756
原创 vue创建项目过慢
创建vue项目过程太慢的解决方法：虽然设置过淘宝镜像npm install-g cnpm --registry=https://registry.npm.taobao.org但是通过vue init webpack projectName新建项目是和淘宝镜像没关系的，因为vue-cli 用的是 npm 源，所以只要设置 npm 源就行了，可以提升创建速度：npm config set registry https://registry.npm.taobao.orgnode-sass需要单独处理慢
2020-10-18 15:46:37
1703
1
转载 vue cli 安装报错
原因很简单，虽然node的环境已经安装完成，npm 包管理器也有了，但是由于有些npm资源被屏蔽或者是国外资源的原因，经常会导致npm安装依赖包的时候失败，所以我们还需要npm的国内镜像----cnpm.原文链接...
2020-10-18 12:05:19
189
原创 Vue.js组件
Vue.js组件组件（Component）是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。组件系统让我们可以用独立可复用的小组件来构建大型应用，几乎任意类型的应用的界面都可以抽象为一个组件树。示例：<div id="app"> <button-counter></button-counter> </div> <script type="text/javascript"> /
2020-10-16 19:59:09
88
原创 2020-10-12
异步编程：异步的概念：异步（Asynchronous, async）是与同步（Synchronous, sync）相对的概念。在我们学习的传统单线程编程中，程序的运行是同步的（同步不意味着所有步骤同时运行，而是指步骤在一个控制流序列中按顺序执行）。而异步的概念则是不保证同步的概念，也就是说，一个异步过程的执行将不再与原有的序列有顺序关系。简单的来说，同步就是按照代码的顺序执行，异步不按照代码的顺序执行，异步的效率更高。通俗易懂的讲：异步就是从主线程发射一个子线程来完成任务。举例说明：Ajax
2020-10-12 22:11:53
112
原创 JavaScript之定时器
定时器JavaScript 提供定时执行代码的功能，叫做定时器（timer），主要由setTimeout()和setInterval()这两个函数来完成。它们向任务队列添加定时任务。1，setTimeout()setTimeout函数用来指定某个函数或某段代码，在多少毫秒之后执行。它返回一个整数，表示定时器的编号，以后可以用来取消这个定时器。var timerId = setTimeout(func|code,delay);setTimeout函数接受两个参数，第一个参数是将要推迟执行的函数名或
2020-10-12 21:05:46
1444
原创 JavaScript之JSON对象
JSON对象一，JSON格式JSON格式（JavaScript Object Notation的缩写）是一种用于数据交换的文本格式 2001年由Douglas Crockford提出，目的是取代繁华笨重的XML格式。相比XML格式，JSON格式有两个显著的优点：书写简单，一目了然；符合JavaScript原生语法，可以有解释引擎直接处理，不用另外添加解析代码 。所以，JSON迅速被接受，已经成为各大网站交换数据的标准格式，并被写入准则。JSON指的是JavaScript对象表示法。JSON比X
2020-10-11 12:15:46
608
原创 正则表达式——匹配规则
正则表达式-匹配规则基本模式匹配一切从最基本的开始。模式，是正则表达式最基本的元素，它们是一组描述字符串特征的字符。模式可以很简单，由普通的字符串组成，也可以非常复杂，往往用特殊的字符表示一个范围内的字符、重复出现，或表上下文 。例如：^once这个模式包含一个特殊字符^，表示只匹配以once开头的字符串。同样的也是如此，只匹配也是如此，只匹配也是如此，只匹配结尾的字符串。^和$同时使用表示精确匹配（字符串与模式一样）。如果一个模式不包括^和$，那么它与任意包含该模式的字符串匹配。如：o
2020-10-11 09:08:53
295
原创 正则表达式——运算符优先级
正则表达式——运算符优先级正则表达式从左到右进行计算，并遵循优先级顺序，这与算术表达式非常类似。相同优先级的从左到右进行运算，不同优先级的运算先高后低。以下从最高到最低列出了各种正则表达式运算符的优先级顺序。\ 转义符(),(?: ),(?=),[] 圆括号方括号*,+,?,{n},{n,},{n,m} 限定符^,$,\任何元字符、任何字符 定位点和序列（位置和顺序）| 替换，“或"操作字符具有高于替换运算符的优先级，“m|food"匹配"m"或"food”，若匹配"mood"或
2020-10-10 20:53:43
456
原创 正则表达式——元字符
正则表达式-元字符\ 将下一个字符标记为一个特殊字符、或原义字符、或向后引用、或八进制转义符。^ 匹配输入字符串的开始位置。$ 匹配输入字符串的结束位置。* 匹配前面子表达式零次或多次。等价{0,}+ 匹配前面子表达式一次或多次。等价{1,}? 匹配前面子表达式零次或一次。等价{0,1}–(当该字符紧跟在任何一个其他限制符（*,+,?,{n},{n,},{n,m}）后面，匹配模式是非贪婪的。非贪婪模式是尽可能少的匹配所搜索的字符串。){n} n为非负整数。匹配n次。{n,}
2020-10-10 13:03:53
610
原创 正则表达式——修饰符
正则表达式——修饰符（标记）标记也称为修饰符，正则表达式的标记用于指定额外的匹配策略。标记不写在正则表达式里，标记位于表达式之外，格式如下：/pattern/flagsi ignore-不区分大小写 将匹配设置为不区分大小写，A a没有区别g global-全局匹配 查找所有的匹配项m multi line - 多行匹配 使边界字符^和$匹配每一行的开头和结尾而不是整个字符串s 特殊字符圆点 . 中包含换行符\n 默认情况下的圆点.是匹配除换行符\n之外的任何字符，加上s修
2020-10-10 12:33:09
2193
1
原创 正则表达式——语法
正则表达式——语法：正则表达式(Regular Expression)是一种文本模式，包括普通字符（例如，a 到 z 之间的字母）和特殊字符（称为"元字符"）。正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字符串。正则表达式是繁琐的，但它是强大的， {极大的提高效率}正则表达式描述了一种字符串匹配的模式，用来检查一个串是否含有某种子串、将匹配的子串替换或者从某个串中取出符合某个条件的子串等。正则表达式放在两个/ 中间 如 /[abc]/g 表示匹配 a b c 字母
2020-10-09 22:43:04
187
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人