- 博客(42)
- 收藏
- 关注
RSS订阅原创 登录流程图
登录流程Created with Raphaël 2.3.0页面准备跳转遇见导航守卫守卫查看是否需要鉴权查看是否有用户信息目标页（或首页）查看是否有token验证token是否有效登录登录页（是否已登录）是否要去登录页其他页面yesnoyesnoyesnoyesnoyesnoyesno...
2022-05-13 15:41:33
1202
原创 移动端适配之rem适配的原理
我们以iPhone6为标准：设备像素是750px，物理像素是375px假如我们把屏幕分成100份，每一份物理像素= 375/100，就是每一份占的宽度3.75px，既1rem就是一份的宽。设计稿给定一个元素尺寸为50px，那么这个元素在iPhone6中就占了 50/3.75 = 13.333333333333334rem由于iPhone6的DPR为2，为了达到高清，设计稿的尺会放大2倍，所以我们会把设计稿缩放为二分之一，元素适配宽度 =设计稿的尺/DPR /（375/100）rem0在这里插入代
2021-11-05 14:18:53
1163
原创 关于npm install -g @vue/cli 报错
npm install -g @vue/cli源文本中存在无法识别的标记。所在位置 行:1 字符: 16这里使用@符号时，要加''才行npm install -g '@vue/cli ’
2021-10-30 22:07:12
498
原创 vue 过渡效果中 leave 钩子函数没有过渡效果
在vue 过渡中，仅用JavaScript 过渡的时候，在 enter 和 leave 中必须使用 done 进行回调。否则after-enter和 after-leave不会调用，并且enter 和 leave将被同步调用，过渡会立即完成。但在 leave中使用done回调时，离开状态也会立即执行，即使不调用done（）函数，leave参数done必须传，不传也会立即删除元素导致动画不执行，但不调用done函数， after-leave又不能执行，导致元素样式display属性不为none，消失不了
2021-08-28 23:30:32
940
原创 vue中使用js控制hmtl元素过渡时没效果
在VUE中我们经常会操作DOM来操作HTML元素的样式进行过渡， 由于浏览器渲染原理（dom树和css树合并后才开始渲染），使用JS操作css样式时，js会同步执行代码，导致后面设置的css样式会覆盖前面的样式，然后渲染页面。所以，这种情况下，我们要应该在设置后面的样式之前，强制渲染一下页面，或者或者使用异步方法(比如settimout)处理后续的css样式...
2021-08-28 00:10:05
194
原创 vue中获取组件的根元素
import Vue from "vue";/** 获取某个组件渲染的Dom根元素*/export default function(comp, props) { const vm = new Vue({ render: (h) => h(comp, { props }), //渲染虚拟DOM }); //$mount()无参数，模板将被渲染为文档之外的的元素 return vm.$el;}...
2021-08-23 16:24:07
2374
原创 解决图片模糊方案
在img元素中使用srcset，放置不同像素大小的图片例：<img src = '1px.png' srcset = '2px.png,3px.png'>
2021-07-19 23:01:16
200
原创 vue 引入本地图片不显示
一般情况我们引入图片方式：这样传过去的图片地址，在页面无法显示：大致总结了一下原因：是由于webpack打包引起的，没打包之前，图片是在src文件夹的assets文件放置的图片，webpack不会把url路径当成依赖项进行打包，打包后，dist文件夹下并没有assets文件，所以图片加载不出来解决方案：先将图片从本地导入到组件中，这样webpack打包时就会把图片当做依赖进行打包，打包后会多一个图片文件夹，从而加载图片<template> <div id="app">
2021-06-22 01:24:42
2419
原创 关于react setState() 要注意的几个点
状态更新可能是异步的在事件中调用setState() 时是异步的，其他情况是同步要解决此问题，请使用第二种形式，setState()该形式接受函数而不是对象。该函数将接收先前的状态作为第一个参数，而将应用更新时的props作为第二个参数：this.setState((state, props) => ({ }));...
2021-05-02 15:55:55
176
原创 vue 脚手架中使用 css module
有的时候在脚手架中需要使用CSS模块，如果直接导入css模块不起作用，需要将模块的文件名改为：xxx.module.oooXXX:为文件名ooo：为文件后缀，如css、less、sass
2021-05-01 20:55:26
335
原创 VUE中操作dom元素的几种方法
VUE中操作dom元素方法一：访问子组件实例或子元素尽管存在 prop 和事件，有的时候你仍可能需要在 JavaScript 里直接访问一个子组件。为了达到这个目的，你可以通过 ref 这个 attribute 为子组件赋予一个 ID 引用。例如：<base-input ref="usernameInput"></base-input>现在在你已经定义了这个 ref 的组件里，你可以使用：this.$refs.usernameInput来访问这个 实例，以便不时之需
2021-02-02 11:10:04
4731
原创 关于mysql删除
使用delete删除语句时，只是逻辑性的删除，并没有在内存中删除掉，这一行的数据的位置任然被占用，我们新添加数据是会跳过这一行，会大量占用内存空间使用truncate删除是物理删除，会清空数据页，...
2021-01-27 12:48:24
108
原创 二叉树遍历 前序、中序、后序遍历
// 二叉树遍历： // 前序遍历（先打印自己、再打印左子树、再右子树） // 中序遍历（先打印左子树、再打印自己、再右子树） // 后序遍历（先打印左子树、再打印右子树、再自己） function Node(value){ this.value = value; this.left = null; this.right = null; } .
2020-12-28 18:49:57
147
原创 下载文件
普通下载 <a href="/res/hill.zip">下载</a>使用迅雷下载 <body> <a resrole="thunder" href="/res/hill.zip">下载</a> <!-- 迅雷下载协议 把完整的下载地址得到 AA地址ZZ base64编码 thunder://base64编码 --> <script>
2020-12-28 15:22:07
125
原创 javascript atob()函数和 btoa()函数-Base64的编码与解码
atob() 函数能够解码通过base-64编码的字符串数据。相反地，btoa() 函数能够从二进制数据“字符串”创建一个base-64编码的ASCII字符串。var str = “RUNOOB”;var enc = window.btoa(str);var dec = window.atob(enc);var res = "编码字符串为: " + enc + “” + "解码后字符串为: " + dec;...
2020-12-28 15:09:50
1235
原创 文件上传
使用formdata<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body&
2020-12-28 15:06:32
120
原创 express
文章目录安装用法路由Express支持以下与HTTP方法同名的路由方法:get方法postt方法put方法delete方法app.all（）响应响应方法中间件安装npm install express --save用法const express = require('express')const app = express();app.get('/news',(req,res,next)=>{ console.log(1) res.status(200) res.
2020-12-24 22:00:58
90
原创 前端常用库
文章目录nodemonaxioscheeriomd5 加密mockjsmomentmysql2sequelizeuuidlog4jsexpressvalidatorvalidate.jsnodemonNodemon是一个实用程序，它将监视源中的任何更改并自动重新启动服务器axioscheeriojQuery核心库md5 加密mockjsmomentmysql2数据库驱动sequelizeORM框架uuidlog4js日志记录expressvalidator验证valid
2020-12-24 18:59:07
926
1
原创 vscode 常用插件
文章目录Auto Rename TagBeautifyES7 React/Redux snippetsES7 React/Redux/GraphQL/React-Native snippetsESLintHighlight Matching TagHTML SnippetsLive ServerMarkdown All in OneMarkdown Preview EnhancedReact makerReact Native ToolsReact-Native/React/Redux snippets f
2020-12-24 18:58:53
625
1
原创 md5加密
文章目录安装用法安装npm install md5用法var md5 = require(‘md5’);md5(‘message’)message – String, Buffer, Array or Uint8Arrayreturns Stringconst Admin = require('../models/admin')const md5 = require('md5')exports.addAdmin =async function(adminObj){ adminOb
2020-12-23 12:26:40
231
原创 网络爬虫
文章目录cheerio （jq核心库）cheerio （jq核心库）var cheerio = require('cheerio'), $ = cheerio.load('<h2 class = "title">Hello world</h2>');$('h2.title').text('Hello there!');$('h2').addClass('welcome');$.html();//=> <h2 class = "title welco
2020-12-22 19:06:51
98
原创 mysql 驱动
文章目录mysql驱动mysql （官方驱动）mysql2 （非官方驱动）mysql2 安装mysql2 使用sql注入攻击防止sql注入连接池mysql驱动mysql （官方驱动）mysql2 （非官方驱动）一般使用mysql2mysql2 安装npm install --save mysql2mysql2 使用mysql.createConnection(config）config配置对象有哪些配置：const mysql = require('mysql2'); // 使
2020-12-19 14:14:25
1428
1
原创 Mysql 使用
文章目录连接到服务器和从服务器断开连接·使用超级管理员进入远程连接，需要知道host主机域名 和用户密码使用指定管理员进入退出登录查看当前有哪些数据库数据库的创建和使用创建数据库使用数据库删除数据库表的创建和查询查看当前数据库有哪些表表的增、删、改、查增1.命令行增加2. 加载本已有的数据库3.查看的表描述信息删清空表删除表改1.修改数据2.插入数据查SELECT 字段 FROM 表SELECT DISTINCT 字段 FROM 表SELECT 字段 FROM 表 WHERE 条件SELECT
2020-12-19 13:31:37
228
原创 node.js笔记
文章目录global -全局对象1. __dirname 返回当前运行文件的文件夹目录2. __filename 返回当前运行文件路径3. clearImmediate(immediateObject)4. clearInterval(intervalObject)5. clearTimeout(timeoutObject)6. console7. exports8. global9. module10. process11. queueMicrotask(callback)12. require()13
2020-12-14 17:49:02
222
原创 git 使用
文章目录Git环境配置查看配置git 工作流程初始化仓库git 命令创建.gitignore文件git status查看当前文件状态。git add 文件名称(文件夹） ,将文件或者文件夹中的所有文件放到暂存区当中。git commit -m git loggit reset 撤销操作（回退版本）git reset HEADgit rm 删除工作区文件git rm 与 git reset的区别git reflog （查看所有记录）git diffgit checkoutgit branchgit merg
2020-12-04 19:04:21
528
原创 数据库 安装使用
安装好数据库后，在命令行工具中使用：启动命令 ： mysql -uroot -p 进入mysql命令交互查看当前数据库字符编码：show variables like ‘character_set_%’;（分号一点要加）修改编码：C:\ProgramData\MySQL\MySQL Server 8.0\my.ini在vscode中打开my。ini文件，将下面两个默认字符集设置为utf8mb4default-character-setcharacter-set-server即：defa
2020-10-12 10:28:01
88
原创 node环境中 如何使用ES6模块
文章目录如何使用ES6模块设置好后，如何运行ES模块如何使用ES6模块1、文件后缀名设置为mjs；例如：a.mjs只是在当前文件中使用es6模块标准导入导出2、最近的package.josn文件中设置type属性，属性值为：module在所有文件中使用 es6模块设置好后，如何运行ES模块1、node --experimental-modules index.mjs（文件名）2、在package.josn文件中设置运行脚本 "scripts":{ "start":"node -
2020-10-09 16:26:42
776
原创 nodejs 中的this， __dirname，__filename问题
console.log("当前模块路径：", __dirname);console.log("当前模块文件：", __filename);exports.c = 3;module.exports = { a: 1, b: 2};this.m = 5;console.log(this === exports); false原因是require函数最终返回的是module.exports，这里的this指向的是最初的module.exportsrequire函数内部原理大致是：
2020-10-09 15:07:49
247
原创 创建项目的方法
创建项目的方法文章目录创建项目的方法手动创建vue脚手架创建手动创建1、使用npm init 初始化 生成package.josn文件2、对pankage.josn文件进行配置 "scripts": { "dev": "webpack --mode=development", "build": "webpack --mode=production" },3、下载webpack 和webpack-cli包4、创建src目录，并创建index.js文件作为主文件5、使用n
2020-10-06 19:48:15
848
原创 普利姆算法
var max = 1000000;var pointSet = [];var distance = [ [0, 4, 7, max, max], [4, 0, 8, 6, max], [7, 8, 0, 5, max], [max, 6, 5, 0, 7], [max, max, max, 7, 0]];function Node(value) { this.value = value; this.neighbor = [];}var
2020-09-25 12:38:15
158
原创 树形结构
二维数组二维拓扑结构（图）树形结构–有向无环图树形结构是图的一种树形结构的特点：1、没有回路2、根节点：最上层的A节点3、叶子节点：下边没有其他节点了4、节点：既不是根节点，又不是叶子节点的普通节点5、树的度：这棵树有最多叉的节点有几个叉，这棵树的度就是几6、树的深度：树最深有几层，深度就是几二叉树：树的度最多为2的树形结构满二叉树 （上图为满二叉树）1、所有的叶子节点都在最底层2、每个非叶子节点都有两个子节点完全二叉树国内定义：1、叶子节点都在最后一层或者倒数第
2020-09-08 19:26:14
2425
原创 快速排序
<script> var arr = [4, 8, 9, 6, 3, 1, 2, 7, 5] // 简单快排 // function quickSort(arr){ // if(arr == null || arr.length == 0){return []} // // 先选一个数，比这个数小的排他左边，大的排右边 // var leader
2020-09-08 16:48:11
137
原创 前端必会算法-冒泡排序和选择排序
<script> var arr = [4, 8, 9, 6, 3, 2, 1, 7, 5] // 比较大小 function compare(a, b) { return a - b > 0 ? true : false } // 前后交换 function exchange(arr, a, b) { var temp = arr...
2020-09-06 22:05:06
161
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人