关注
分享
不定时分享一些踩坑和一些学习笔记,希望可以帮助到各位小伙伴,喜欢就给我点个赞呗
可爱的橙子大爷
一个热爱前端的小萌新
展开
-
有关于我
欢迎来到我的小小世界，初次见面，多多指教，共同学习，一起进步，希望大家在这条道路上可以坚持的久一点，不要轻易放弃，凡是拼进全力去做，不要让自己有遗憾，敢闯敢拼，勇往直前。也祝点赞的各位，心想事成，早日暴富，早日脱单...原创 2020-09-24 14:02:33 · 77 阅读 · 0 评论
-
vue3+ts项目打包 性能优化+压缩代码体积
vue3 打包压缩 优化原创 2023-11-02 10:45:25 · 364 阅读 · 0 评论 -
vue3+ts 使用vue-print-nb 打印功能【完美】
代码经过删减，如果使用有问题，可与我联系。我的版本 0.1.4。原创 2023-10-20 16:56:41 · 2371 阅读 · 9 评论 -
css 更改浏览器滚动条样式
原生的滚动条太难看了，问了前端大神，终于修改好了，供上代码。原创 2023-07-31 15:33:34 · 186 阅读 · 0 评论 -
vue3 + TS + Vue3 BaiduMap Gl 丝滑根据ip获取定位
官网。原创 2023-06-25 13:58:38 · 587 阅读 · 0 评论 -
Vue+ElementUI Cascader 级联选择器 省市区修改回显
【代码】Vue+ElementUI Cascader 级联选择器 省市区修改回显。原创 2023-04-25 17:21:34 · 773 阅读 · 1 评论 -
[已解决] MySQL 8.0.23 nitializing database出现红叉
我翻遍所有解决方案 在某位文章的评论区 看到了答案 附上链接。以管理员方式运行 cmd。原创 2023-03-14 17:23:59 · 1368 阅读 · 0 评论 -
浅谈一个url从输入到渲染的过程
一个url 比如 www.baidu.com 在浏览器地址栏输入原创 2023-03-09 17:34:56 · 46 阅读 · 0 评论 -
Express 学习 - 02-中间件应用-urlencoded解析
世界纷繁嘈杂，多一技傍身。原创 2022-12-19 16:24:06 · 590 阅读 · 0 评论 -
express学习 -01-创建安装简单使用
世界纷繁嘈杂，多一技傍身。原创 2022-12-19 11:59:29 · 74 阅读 · 0 评论 -
uni-app 运行到模拟器
uni-app 启动 mumu模拟器原创 2022-12-02 17:49:46 · 5410 阅读 · 12 评论 -
简单代码实现 网站灰色蒙版
简单代码 搞定灰色蒙版原创 2022-12-01 09:00:33 · 490 阅读 · 0 评论 -
Sourcetree+ idea 更改项目地址
也许是天气太冷了，脑子都不动了，最近项目更换Codeup地址，折腾了我半天，没想到这么简单。云效这个也可以设置下，方便以后下载代码。3. 选编辑输入刚才复制的地址。原创 2022-11-30 12:27:34 · 512 阅读 · 0 评论 -
【搞定深拷贝-浅拷贝】之手写深拷贝
我觉得很多概念都太复杂了，我直接说我的理解吧这是一个对象，我们现在要对它进行拷贝浅拷贝{…info}就是浅拷贝，就是直接把这个对象解构出来赋值给newObj；因为info本身会在内存中创建一个新的内存地址，且因为friend是一个对象，所以它也有自己的内存地址因为解构赋值的过程相当于在内存地址创建了一个新的地址存储newObj,此时friend的内存地址也会一起复制过去，并没有给friend创建新的内存地址，它指向的还是旧的内存地址，当我们改变friend的name时，newObj和info的fr原创 2022-06-24 16:07:50 · 206 阅读 · 0 评论 -
async-await使用之解决回调地狱
问：什么是async？答：就是一个异步函数，也是generator的语法糖，不过它返回的是一个Promise，要配合await关键字使用。需求：发送一次网络请求，等到这次网络请求有结果，再发送一次网络请求把这一次的结果返回出去，等到这次网络请求的结果完成，再发送一次网络请求把上一次的结果返回出去，等到这次网络请求的结果，以此类推网络请求如下方式一：层层嵌套 产生回调地狱，阅读性差方式二:使用异步函数...原创 2022-06-21 17:56:16 · 682 阅读 · 0 评论 -
设置position: sticky；不生效的原因
昨天设置 position: sticky;属性没生效，我辛辛苦苦排查了一天，终于找到了原因原创 2022-06-09 09:43:44 · 2389 阅读 · 0 评论 -
浅谈-可迭代对象(iterable)
什么是可迭代对象它和迭代器概念不同当一个对象实现了iterable protocol协议时，它就是一个可迭代对象这个对象要求是必须实现@@iterator方法,在代码中我们使用Symbol.iterator访问该属性把数组作为迭代器的参数，并且[Symbol.iterator]返回一个迭代器对象特点：返回是一个函数每次调用生成的都是一个新的迭代器代码// 创建一个迭代器对象来访问数组元素const iterableObj = { names: ["abc", "ssdd",原创 2022-04-14 10:28:36 · 570 阅读 · 0 评论 -
浅谈- 迭代器（iterator）
什么是迭代器？是确使用户可在容器对象上遍访的对象，使用该接口无需关心对象内部的实现细节最早出现在1974年设计的CLU编程语言编程语言：java python在js中，迭代器是一个具体的对象，这个对象需要符合迭代器协议，这个协议定义了产生一系列的值（无论是有限还是无限个）的标准方式那么在js中这个标准就是一个特点的next方法next函数要求是一个无参函数或者一个函数done如果迭代器可以产生序列中的下一个值，则为false如果迭代器已将序列迭代完毕，则为true，这种情况下，原创 2022-04-14 10:07:39 · 1213 阅读 · 0 评论 -
手写promise-then方法(简单实现)
const PROMISE_STATUS_PEDDING = 'pedding'const PROMISE_STATUS_FULFILLED = 'fulfilled'const PROMISE_STATUE_REJECTED = 'rejected'class XYPromise { constructor(executor) { this.status = PROMISE_STATUS_PEDDING this.vaule = undefined原创 2022-04-12 17:32:04 · 158 阅读 · 0 评论 -
浅谈-跨域
什么是跨域一个url是由协议，域名，端口（默认80）组成，当一个url的协议域名端口三者之间任意有一个与当前页面url不同时为跨域产生原因由于浏览器的同源策略同源策略（same origin policy）是一种约定，它是浏览器核心也是基本的安全功能，它会阻止一个域的js脚本与另外一个域的内容进行交互，如果缺少了同源策略，浏览器容易受到xss，crr攻击所谓同源（既在一个域），就是这两个页面具有相同的协议主机和端口号非同源会出现的限制无法读取非同源网页的cookie，localStroag原创 2022-04-12 16:25:53 · 97 阅读 · 0 评论 -
手写promise-状态设计
const PROMISE_STATUS_PEDDING = 'pedding'const PROMISE_STATUS_FULFILLED = 'fulfilled'const PROMISE_STATUE_REJECTED = 'rejected'class XYPromise { constructor(executor) { this.status = PROMISE_STATUS_PEDDING this.vaule = undefined .原创 2022-04-12 16:10:42 · 317 阅读 · 0 评论 -
ps不能完成命令因为暂存盘已满
今天用ps发现这个问题，原来是c盘爆了，换个存储空间就行原创 2022-03-25 14:11:12 · 514 阅读 · 0 评论 -
Error: listen EADDRINUSE: address already in use 127.0.0.1:8888
今天遇到很坑的bug搞了我半天，经过多方查询，才知道是端口被占用了，但是我一直不明白无敌端口为什么会被占用，前一会还是正常运行的；知道了原因那我们就关闭端口就好了：1.打开控制台 输入 netstat -ano 查看所有端口2. 找到你被占用的端口 的 pid 并记住他3. taskkill -f /pid pid（你的被占用端口的pid）完成 重新启动项目即可参考文章...原创 2022-02-16 16:42:50 · 4080 阅读 · 8 评论 -
canvas写一个随鼠标移动的矩形
这两天被canvas完虐，搞了两天，终于写出了一个小功能，矩形可以随着鼠标移动移动，矩形也可以用drawImage替换成图片，同理，代码简单就不写注释了，在这记录一下防止遗忘<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"原创 2022-01-05 15:06:36 · 1677 阅读 · 2 评论 -
flex解决换行第一行和最后一行两端对不齐的问题
昨天用flex布局，第一行和最后一行死活对不齐，然后我就查资料：网友上用 align-content: flex-start;死活对我没用啊，然后继续找资料，功夫不负有心人，终于找到了在第一行插入几个这个，排几个放几个，最后一行后面也是li style="visibility: hidden;height: 0;margin: 0;"></li>完美...原创 2022-01-05 09:04:01 · 993 阅读 · 0 评论 -
webpack：options has an unknown property ‘contentBase‘. These properties are valid:
学习webpack之路真的报错老多，我又来了，这个错误的意思是contentBase这个属性失效了，我们得换成static devServer: { static: './public', hot: true, },原创 2021-12-17 11:04:19 · 1288 阅读 · 1 评论 -
Error: [vue-loader] vue-template-compiler must be installed as a peer dependency, or a compatible...
这两天学习webpack，安装vue搞出一个一个错误：查资料解决后记录一下，奉上参考地址，在这记录一下，防止遗忘https://blog.csdn.net/qq_42899245/article/details/118189209Error: [vue-loader] vue-template-compiler must be installed as a peer dependency, or a compatible compiler implementation must be passed原创 2021-12-17 09:32:48 · 893 阅读 · 0 评论 -
webpack学习之 HtmlWebpackPlugin CleanWebpackPlugin
继续上一篇webpack的学习：手动删除dist文件夹:CleanWebpackPluginHTML进行打包处理我们可以使用插件：HtmlWebpackPlugin；BASE_URL的常量 :DefinePlugin在vue的打包过程中复制public到dist文件夹:CopyWebpackPlugin；有报错，暂时不配置安装：npm install clean-webpack-plugin html-webpack-plugin copy-webpack-plugin -D配置：webpac原创 2021-12-16 15:29:00 · 196 阅读 · 0 评论 -
webpack学习 之 加载字体文件
继续我们上一篇的webpack学习，现在我们进一步学习 其他的配置配置: package.config.js rules:[ { test: /\.(eot|ttf|woff2?)$/, type: "asset/resource", generator: { filename: "font/[name]_[hash:6][ext]" } } ]...原创 2021-12-16 11:48:05 · 800 阅读 · 0 评论 -
webpack学习之 less-loader file-loader url-loader 以及 认识asset module type
继续我们上一篇的webpack学习，现在我们进一步学习 其他的配置less-loader：预处理器安装：npm install less-loader -D配置: package.config.js const path = require('path');module.exports = { mode: "development", entry: "./src/main.js", output: { path: path.resolve(__dirname, "./build"),原创 2021-12-15 16:07:15 · 571 阅读 · 0 评论 -
webpack学习之 style-loader / css-loader
继续我们上一篇的webpack学习，现在我们进一步学习 其他的配置css-loader：用于让webpack加载这个css文件安装：npm install css-loader -D / npm install style-loader -D配置: package.config.js const path = require('path');module.exports = { mode: "development", entry: "./src/main.js", output: {原创 2021-12-15 15:58:39 · 852 阅读 · 0 评论 -
webpack学习之webpack的局部使用
最近又想巩固一下webpack，然后又把王红元老师的课程找出来了，老规矩，上概念webpack:是一个静态的模块化打包工具，它是依赖node的，目前使用很广，三大框架都基于它， 安装： npm install webpack webpack-cli –g # 全局安装 npm install webpack webpack-cli –D # 局部安装 建议使用方式一：直接使用命令 webpack / npx webpack 不建议方式儿：脚本使用 建议 01.新建webpack.co原创 2021-12-15 15:30:33 · 522 阅读 · 0 评论 -
高德地图 定位 设置文本
最近写项目需要用到地图，地图要求标点和加文本显示地址，后来找到了对应的写法，在这儿记录一下，以防忘记；当然需要自己给定义一个内容框用来展示，也需要引入高德的api；废话不多说，上代码, var map = new AMap.Map('Map', { center: [xxxx, xxxx], // 修改成相应坐标 lang: 'en' }); var marker = new AMap.Marker({ position: new AM原创 2021-12-10 11:07:40 · 926 阅读 · 0 评论 -
Javascript学习/一个简单的深拷贝事件
const obj = { name: "wxy", friend: { name: "kobe" }};const info = JSON.parse(JSON.stringify(obj))原创 2021-12-08 15:08:56 · 63 阅读 · 0 评论 -
Javascript学习/ 防抖-节流
最近在学习王红元老师的高级js课程，学到了防抖和节流，想写篇笔记记录下，以防忘记,如有错误，欢迎指正一先上概念防抖：函数防抖，就是指触发事件后，在 n 秒后只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数的执行时间。我们可以理解为坐公交，司机开门等5秒如果有一个上车后准备关门，如果有看到后面有人，司机会继续等待5秒，直到没有人上车为止节流：限制一个函数在一定时间内只能执行一次，我们可以理解为地铁：在正常情况下地铁到站后不管有多少人上车，在一定时间内就会关门，如果后面人有没有赶上，只能等待下原创 2021-12-08 15:05:35 · 434 阅读 · 0 评论 -
Javascript学习/jq 播放视频封装
最近想封装播放视频的代码块，查了半天，才发现由于jquery中没有video的paly,pause方法，所以在使用jquery来控制视频的播放的播放状态时会出现问题，解决这个问题，首先需要用get(0)的方法将jQuery对象转为原生js对象，废话不多说，上代码 toggleSound($('#video1'), '#img1') function toggleSound(video, img) { var flag = false; $(img).click原创 2021-09-26 11:28:55 · 186 阅读 · 0 评论 -
前端 css 鼠标自定义小箭头
最近想把鼠标小箭头替换掉，由于设及图片太多，js写不出来，于是找到了简单的css cursor: url('../img/logo.png'), auto是的没错，就是这么简单原创 2021-09-16 14:10:06 · 400 阅读 · 0 评论 -
Javascript学习/ this 指向学习
最近重学this，找了很多资料，最后参考了王红元老师的公众号的文章，有了一下总结，别碰1.普通函数：this在全局作用域下默认windowfunction aaa() { console.log(this)//window}2.隐式绑定：是它的调用位置中，是通过某个对象发起的函数调用。前提条件：必须在调用的对象内部有一个对函数的引用（比如一个属性）；如果没有这样的引用，在进行调用时，会报找不到该函数的错误；正是通过这个引用，间接的将this绑定到了这个对象上；function foo(原创 2021-08-31 11:55:13 · 113 阅读 · 0 评论 -
前端 日期格式化插件 dayjs
最近写项目用到了时间格式化，想自己封装一个，发现自己没有那个能力，这就尴尬了，还好有万能的网友大神们，找到了data-format这个插件，用起来还是很丝滑的，上效果下面来说说使用步骤：1 安装npm install dayjs 或yarn add dayjs2 封装data-format.tsimport dayjs from 'dayjs'import utc from 'dayjs/plugin/utc'dayjs.extend(utc)const DATE_TIME_原创 2021-08-31 11:30:58 · 739 阅读 · 0 评论 -
近期遇到scss报错：To install it, you can run: npm install --save !!vue-style-loader!css-loader?
近期写vue项目遇到scss报错，查了上午，看了各种网友的解决方案，在此，我找到了适合自己的解决方案，因为之前直接安装的sass版本过高，如果是vue2建议：npm install sass-loader@7.3.1 --save当然前提是要安装node sass 这个好像没有版本要求，npm install node-sass --save即可，–save的意思就是运行时依赖，开发后也需要依赖，–save -dev是开发时依赖，详情可以看https://segmentfault.com/q/10100.原创 2021-04-27 13:59:44 · 1658 阅读 · 1 评论