笔记
YellowWenJie
这个作者很懒,什么都没留下…
展开
-
要想在 ***.module.scss 里写动画,需要这么么写
css原创 2022-07-11 21:44:41 · 276 阅读 · 1 评论 -
GO 读 yaml 的坑
adw原创 2022-07-08 21:20:01 · 348 阅读 · 0 评论 -
docker 创建的 mysql8 怎么改密码
docker 创建的 mysql8 怎么改密码 查看容器 进入容器 登录mysql 修改密码 修改本地密码 退出 mysql 退出 docker原创 2022-06-17 01:38:51 · 242 阅读 · 0 评论 -
github 问题
GitHub无法访问、443 Operation timed out的解决办法 - 掘金转载 2022-04-16 23:50:03 · 114 阅读 · 0 评论 -
position: fixed 相对于盒子固定显示而非浏览器窗口
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l.原创 2022-03-05 18:55:00 · 272 阅读 · 0 评论 -
koa2 jwt
用户登录成功后,将用户信息保存到 token 之后,用户请求的时候怎么拿到 用户信息? // 剔除完毕之后,user 中只保留了用户的 id, username, nickname, email 这四个属性的值 const user = { ...dataBase[0], password: "" }; //对用户的信息进行加密,生成token字符串jwj.sign(加密的对象,加密使用到SecretKey的值) const tokenStr = jwt.sign(user原创 2022-02-11 17:19:16 · 2527 阅读 · 0 评论 -
mysql 基本操作
-- 进入表use myblog;-- 查数据库的表show tables;-- 在users表中插入数据,因为password是关键字,所以要用`password`insert into users(username,`password`,realname)values('yellowwenjie','123456','黄文杰');-- //查询-- 查询users表select * from users;-- 查询users表中的id和usernameselect id,usern.原创 2022-02-10 12:55:25 · 410 阅读 · 0 评论 -
关于箭头函数
1. 箭头函数不能使用 arguments、super、和 new.target(抽象基类,详细见 /261)。此外,箭头函数没有 prototype 属性原创 2022-02-08 19:15:28 · 235 阅读 · 0 评论 -
洗牌算法,输入数字,获取随机数
class SuperArray extends Array { shuffle() { // 洗牌算法 for (let i = this.length - 1; i > 0; i--) { const j = Math.floor(Math.random() * (i + 1)); [this[i], this[j]] = [this[j], this[i]]; } }}const a = new SuperArray(1, 2, 3.原创 2022-02-07 22:28:41 · 263 阅读 · 0 评论 -
koa2 使用 Joi
封装函数:const { ErrorModel } = require("../model/resModel");function schema(method, schemas) { async function validateSchema(ctx, next) { let data = null; if (method === "get") { data = await ctx.request.query; } else { data = aw原创 2022-02-06 14:27:06 · 968 阅读 · 0 评论 -
Vue 中使用 Sass
"sass": "^1.26.5","sass-loader": "^8.0.2",npm install [email protected] [email protected] --save-dev原创 2022-02-05 21:49:32 · 878 阅读 · 0 评论 -
WebSocket 基本使用
服务端:const ws = require("nodejs-websocket");const server = ws.createServer(function (con) { console.log("websocket 服务端"); con.on("text", function (str) { con.sendText(str); }); // setTimeout(function () { // con.sendText("来自服务端的消息"); /原创 2022-02-04 07:47:34 · 340 阅读 · 0 评论 -
css选择器记录
:empty选择器选择每个没有任何子级的元素(包括文本节点)。原创 2022-02-04 07:45:24 · 76 阅读 · 0 评论 -
Dom 操作问题记录
要实现这种效果首先想到的还是这个方法document.body.innerHTML += `<p>${e.data}</p>`但是这会出现问题,只能输出一个字符串,因为下一次执行会直接覆盖上一次的 dom 操作,解决方案: let p = document.createElement('p') p.innerHTML = e.data; // appendChild() 方法可向节点的子节点列表的末尾添加新的子节点 docu原创 2022-02-04 07:39:25 · 269 阅读 · 0 评论 -
JavaScript的原型链
8.3.1 原型链ECMA-262 把原型链定义为 ECMAScript 的主要继承方式。其基本思根就是通过原型继承多个引用类型的属性和方法。重温一下构造函数、原型和实例的关系:每个构造函数都有一个原型对象,原型有一个原型指回构造函数,而实例有一个内部指针指向原型。如果原型是另一个类型的实例呢?那就意味着这个原型本身有一个内部指针指向另一个原型,相应地另一个原型也有一个指针指向另一个构造函数。这样就在实例和原型之间构造了一条原型链。这就是原型链的基本构想。...原创 2022-02-02 20:12:52 · 311 阅读 · 0 评论 -
关于 koa2 使用 koa-jwt 出现的问题
在使用 koa-jwt 的时候要进行 Token 的身份认证,所以要添加中间件,但是 koa2 的处理 jwt 创建错误的中间件与 express 不同express 处理中间件:// 导入 express 模块const express = require("express");//一定要在路由之前配置解析Token的中间件const expressJWT = require("express-jwt");// 导入配置文件const config = require("./con原创 2022-01-31 22:12:58 · 1176 阅读 · 0 评论 -
koa2 图片上传
首先必须允许文件上传const KoaBody = require("koa-body");// 使用文件上传中间件app.use(KoaBody({ multipart: true }));然后是要然外部能访问图片const serve = require("koa-static");const path = require("path");app.use(serve(path.join(__dirname, "/public")));...原创 2022-01-30 14:25:41 · 1935 阅读 · 1 评论 -
express 利用 session 记录阅读量
const session = req.session; if (session.viewNum == null) { session.viewNum = 0; } session.viewNum++; res.json({ viewNum: session.viewNum });原创 2022-01-28 23:28:21 · 341 阅读 · 0 评论 -
自定义迭代器
class Counter { // Counter 的实例应该迭代 limit limit: any; count: number; constructor(limit: number) { this.limit = limit; this.count = 1; } next(): any { if (this.count <= this.limit) { return { done: false, value: this.count+.原创 2022-01-27 16:21:17 · 618 阅读 · 0 评论 -
迭代器与生成器
对于我这种前端小白来说,迭代器和生成器可能一时间难以理解,这个问题也困扰了我很长一段时间,查了很多资料,这里简单谈谈首先要知道什么叫迭代在JavaScript中,计数循环就是一种最简单的迭代,比如for (let i = 1;i <= 10; ++i) { console.log(i)}循环是迭代的基础,这是因为它可以指定迭代的次数,以及每次迭代要执行什么操作。每一次循环都会在下一代开始之前完成,而每次迭代的顺序都是事先定义好的。 迭代会在一个有序集合上进行。(“有序”可.原创 2022-01-27 12:10:16 · 488 阅读 · 0 评论 -
cookie httpOnly 只允许后端修改cookie
// 操作 cookie res.setHeader( "Set-Cookie", `username=${data.username}; path=/; httpOnly` );原创 2022-01-24 23:10:22 · 4209 阅读 · 0 评论 -
关于node设置响应头问题
content-type不能写成Content-Type const promise = new Promise((resolve, reject) => { if (req.method !== "POST") { resolve({}); return; } // content-type不能写成Content-Type if (req.headers["content-type"] !== "application/json") {原创 2022-01-24 00:51:16 · 635 阅读 · 0 评论 -
分享我的vscode配置
{ "workbench.iconTheme": "vscode-icons", "workbench.colorTheme": "One Dark Pro Flat", "editor.minimap.enabled": false, "files.autoSave": "afterDelay", "editor.fontLigatures": false, // 100 列后换行 "editor.wordWrapColumn": 100, ...原创 2022-01-15 14:14:33 · 1760 阅读 · 0 评论 -
vscode插件推荐
1.代码智能提示Kite AI Code AutoComplete Visual Studio IntelliCode JavaScript(ES6) code snippets Tabnine Autocomplete AI2.主题+文件夹IconsNight Owl One Dark Pro Material Theme Ayu Material Theme Icons Dracula Theme vscode-icons3.大型项目新建文件advand-new-fil原创 2022-01-15 14:12:32 · 577 阅读 · 0 评论 -
indexOf()、 lastIndexOf()以及includes()
indexOf()一个值就是从0下标开始找,返回要查找的值得下标俩个值,如图,就是从下标为二的那个值开始找lastIndexOf()第二个参数还是个密,搞不懂es6新增的includes()includes() 方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。接受两个参数,第一个参数是需要查找的元素值,第二个参数代表是从该索引开始搜索,如果为负数,那么按照 array.length + index 处的索引开始搜索,.原创 2022-01-10 21:50:54 · 65 阅读 · 0 评论 -
.sort()
开始可能方法使用错误需要给他一个排序规则原创 2022-01-10 20:44:25 · 31 阅读 · 0 评论 -
记录笔试题
利用纯css构造一个三角形 div { width: 0px; height: 0px; background-color: transparent; margin: auto; border: 30px solid red; border-color: red green blue yellow; /*上*/ /* border-color: red transparent transparent tra原创 2022-01-10 19:12:22 · 31 阅读 · 0 评论 -
display值整理
display基本值:值 描述 none 此元素不会被显示。 block 此元素将显示为块级元素,此元素前后会带有换行符。 inline 默认。此元素会被显示为内联元素,元素前后没有换行符。 inline-block 行内块元素。(CSS2.1 新增的值) list-item 此元素会作为列表显示。 run-in 此元素会根据上下文作为块级元素或内联元素显示。 compact CSS 中有值 compact,不过由于缺乏广泛..转载 2022-01-10 14:55:41 · 53 阅读 · 0 评论 -
CSS columns
指定列的宽度和数量:columns 属性是一个速记属性设置列宽和列数。columns 是 column-width 与 column-count 的简写属性。语法:columns: 列的宽度 列数原创 2022-01-10 14:21:02 · 270 阅读 · 0 评论 -
Vue获取元素高度
// 当前区域<div ref="element"></div>// 获取高度值 (内容高+padding+边框)let height= this.$refs.element.offsetHeight; //100// 获取元素样式值 (存在单位)let height = window.getComputedStyle(this.$refs.element).height; // 100px//获取元素内联样式值(非内联样式无法获取)let height...原创 2022-01-09 15:22:28 · 1344 阅读 · 0 评论 -
getBoundingClientRect()以及 getClientRects() 的区别
<div id="box"></div>var object=document.getElementById('box'); rectObject = object.getBoundingClientRect(); rectObject.top:元素上边到视窗上边的距离; rectObject.right:元素右边到视窗左边的距离; rectObject.bottom:元素下边到视窗上边的距离; rectObject.left:元素...原创 2022-01-09 15:02:34 · 618 阅读 · 0 评论 -
offsetTop、clientTop、scrollTop、offsetTop
HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidthscrollHeight: 获取对象的滚动高度。scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离scrollWidth:获取对象的滚动宽度offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度offsetLeft...原创 2022-01-09 14:58:32 · 1066 阅读 · 0 评论 -
css中“~”
为所有相同的父元素中位于 p 元素之后的所有 ul 元素设置背景:p~ul{ background:#ff0000;}<p>快乐生活</p><ul> <li>生活</li> <li>生活</li> <li>生活</li></ul>p~ul选择前面有 <p> 元素的每个 <ul> 元素。定义和用法..原创 2022-01-07 22:42:46 · 530 阅读 · 0 评论 -
Vue如何监听滚动条
export default { mounted() { window.addEventListener("scroll", this.handleScroll, true); }, methods: { handleScroll(e) { let scrollTop = document.documentElement.scrollTop || document.body.scrollTop; console.log(scrollTop.原创 2022-01-04 21:51:33 · 2670 阅读 · 0 评论 -
Vue如何监听滚动条
export default { mounted() { window.addEventListener("scroll", this.handleScroll, true); }, methods: { handleScroll(e) { let scrollTop = document.documentElement.scrollTop || document.body.scrollTop; console.log(scrollTop.原创 2022-01-04 21:50:09 · 318 阅读 · 0 评论 -
阿里图标symbol 方式引用
symbol 引用这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇文章这种用法其实是做了一个svg的集合,与上面两种相比具有如下特点:支持多色图标了,不再受单色限制。 通过一些技巧,支持像字体那样,通过font-size,color来调整样式。 兼容性较差,支持 ie9+,及现代浏览器。 浏览器渲染svg的性能一般,还不如png。使用步骤如下:第一步:拷贝项目下面生成的symbol代码://at.alicdn.com/t/font_8d.原创 2021-12-29 17:16:53 · 671 阅读 · 0 评论 -
vue2+vue-awesome-swiper4
<template> <swiper class="swiper" :options="swiperOption"> <swiper-slide>Slide 1</swiper-slide> <swiper-slide>Slide 2</swiper-slide> <swiper-slide>Slide 3</swiper-slide> <swiper-slide&g..原创 2021-12-28 21:45:26 · 275 阅读 · 0 评论 -
vue2引入ionicons图标
安装:npminstall--savevue-ionicons按需引入:<template> <div class="home"> <AlertIcon/> </div></template><script>// @ is an alias to /src// import HelloWorld from '@/components/HelloWorld.vue'import AlertI...原创 2021-12-27 22:39:27 · 1510 阅读 · 0 评论 -
CSS mix-blend-mode
mix-blend-mode 属性描述了元素的内容应该与元素的直系父元素的内容和元素的背景如何混合原创 2021-12-27 17:56:26 · 50 阅读 · 0 评论 -
user-select: none
在 web 浏览器中,如果您在文本上双击,文本会被选取或高亮显示。此属性用于阻止这种行为原创 2021-12-27 17:26:25 · 106 阅读 · 0 评论