- 博客(53)
- 收藏
- 关注
RSS订阅原创 WSL 2 自动更新 虚拟 IP 到 window hosts
window下的wsl2开发中使用到域名映射，但是WSL2每次启动都会被分配一个虚拟的ip地址，每次启动虚拟ip都不一样，导致要频繁更改window的hosts文件，太麻烦了，所以写一个自动执行的.sh脚本，每次启动之后自动获取虚拟ip，并写入到window的hosts文件中。1、在当前用户目录下新建script/get_wsl_ip.sh文件脚本，我的路径\\wsl$\Ubuntu\home\user1\scripts。3、重启wsl即可。
2025-01-20 11:38:19
387
原创 随遇随记篇
HTTP协议是以ASCll码传输的，HTTP请求主要有三个部分：状态行、请求头、消息主体。消息主题没有规定必须使用什么编码方式，所以需要在请求头里面设置content-type编码方式，消息主体满足这里设定的编码方式即可。服务器端根据请求头的Content-Tyoe字段获知请求中的消息主体使用何种编码方式，再对主体进行解析。是javascript内置的函数，用于计算字符串表达式的值，即把字符串转成代码执行返回运算值。若属性不是ref定义的，也是直接返回原始值；
2025-01-20 11:22:29
505
原创 面试遇到的问题
这种方式可以实现属性和方法的继承，但是不能传递构造函数的参数。结合了原型链继承和构造函数继承，既继承了父构造函数的属性，又继承了父构造函数原型对象上的方法。Object.create() 是把现有对象的属性，挂到新建对象的原型上，新建对象为空对象.b、跨站请求伪造(CSRF): 攻击利用用户的登录状态，冒充用户发起请求，执行未授权的操作。：在不改变原有HTML结构的情况下，安全地对用户输入进行清洗和转义，以防止潜在的XSS攻击；bb) 对输入的特殊字符 转译为html的实体，可以简单的防止XSS攻击。
2024-11-01 12:12:31
269
原创 vite + vu3 + ts 项目，报错集合
这里更换 node 版本 强烈建议 使用 NVM 工具，切换 node 版本贼快，再也不用像之前那样 卸载node重装啦。这个报错是 node 版本问题，一查 版本是 14.21.1 的，换成 16.0.0 的 问题解决。
2023-10-10 15:33:11
1172
原创 vue2 底层原理
vue2中 数据劫持的核心技术： 使用 Object.defineProperty()；发布订阅模式+ 数据劫持方式 实现 v-model 数据双向绑定。
2023-02-16 18:16:31
785
原创 微信小程序学习笔记
什么是宿主环境指程序运行所必须依赖的环境，例如：Android系统和 IOS系统是两个不同的宿主环境，安卓版的微信App是不能在 ios环境下运行的，所以，Android是安卓软件的宿主环境，脱离了宿主环境的软件是没有任何意义的。小程序的宿主环境手机微信是小程序的宿主环境，小程序借助宿主环境提供的能力，可以完成许多普通网页无法完成的功能，例如：微信扫描、微信支付微信登陆、地理定位等等小程序宿主环境包含的内容通信模型运行机制组件API。
2023-02-05 16:30:58
600
原创 react脚手架配置代理
工作方式： 当请求了 3000 不存在的资源时，那么该请求会转发给5000（优先匹配前端资源）创建代理配置文件，文件名为 setupProxy.js 名字不能改。优点：可以配置多个代理，可以灵活的控制请求是否走代理，优点： 配置简单，前端请求资源时可以不加任何前缀。在package.json 中追加如下配置。缺点： 配置繁琐，前端请求资源时必须加前缀。缺点：不能配置多个代理。
2023-02-03 19:56:30
197
原创 webpack学习
目录1. 简介1. Entry 入口2. Output 3. Loader4. Plugins5. Model2. webpack 体验1. 开发环境控制台 输入 指令： 2. 生产环境控制台 输入 指令： 3.node 运行这个文件，输出 3结论：3. webpack 打包样式资源4. 打包 html资源5. 打包图片资源6. 打包其他资源webpack5:webpack4: 需要加上 url-loader7. devserve 热更新8. 提取 css 成单独文件9. css兼容性处理10. css
2022-12-02 10:15:11
2010
原创 unable to resolve dependency tree
在安装命令 后面加上 ‘--degacy-peer-deps' 或者 '--force', 后者 force一看就危险，所以没有试过。当依赖项存在无法解决的冲突问题时，npm 7.6.几 以上的版本会去安装它，而低版本不会。the unstream dependency conflict： 非流依赖项冲突？例如： 我这边安装 element table 拖拽插件 sortablejs。问题： 公司的项目 安装依赖的时候，报错：无法安装依赖。npm 7.6.几 以上的 版本问题；
2022-11-15 18:24:04
270
原创 js 数学的方法整合
Math.LOG10E // 返回以 10 为底的 e 的对数（约等于 0.434）Math.LOG2E // 返回以 2 为底的 e 的对数（约等于 1.414）Math.SQRT1_2 // 返回 1/2 的平方根。Math.LN10 // 返回 10 的自然对数。Math.LN2 // 返回 2 的自然对数。Math.SQRT2 // 返回 2 的平方根。Math.sqrt(x) 返回 x 的平方根值。......
2022-08-29 12:02:53
210
原创 VSCode 工具常用插件
修改了前面的开始标签，自动remane 后面的闭合标签。html 中的 id 和 class 的属性 提示。对vue一些属性或者其他方法的 helper说明。鼠标放到代码行上可以显示，改行的上一次修改记录。快捷键模板，设置模板快捷键，加快开发速度。vscode对 ECharts 的支持，方便运行代码，浏览器打开。vue的一些代码片段。...
2022-08-22 19:31:22
2741
原创 vue页面动画
如果 animation-direction 值是 "alternate"，则动画会在奇数次数（1、3、5 等等）正常播放，而在偶数次数（2、4、6 等等）向后播放。alternate-reverse：逆序交替迭代，第一次以reverse播放，第二次以normal播放。2. 百分比，如 0%，25%，50%，100%注释：请始终规定 animation-duration 属性，否则时长为 0，就不会播放动画了。animation-fill-mode 属性规定动画在播放之前或之后，其动画效果是否可见。
2022-07-21 11:18:16
1464
原创 浏览器中JavaScript 事件
最先调用的是 Window对象上注册的捕获处理程序，然后调用 Document对象的捕获处理程序，接着是 元素，沿着 DOM树一直向下，直到事件目标元素的捕获事件处理程序被调用。有两种注册事件处理程序的方式，第一种是web早期就有的，及设置作为事件目标的对象或者文档的一个属性。在使用 html属性定义事件处理程序时，属性值应该是一段JavaScript代码字符串，这段代码是事件处理程序函数的函数体，不是完整的函数声明，没有 function关键字。目标处理程序被调用之前的阶段，叫捕获阶段。
2022-07-03 12:12:28
724
原创 js 深拷贝 和浅拷贝
什么是深拷贝、浅拷贝？1、 首先基础类型 的赋值 没有什么 深拷贝浅拷贝之说，就是赋值，非要选一个归类就是什么拷贝；2、引用类型（Array、Object、Function）深拷贝浅拷贝浅拷贝 会 藕断丝连，赋值的是引用的地址，3、深拷贝使用 JSON.parse 和JSON.stringify() 可以解决 数组和 对象这些引用类型的深拷贝4、深拷贝通用方法JSON.parse 和JSON.stringify()可以解决基本的 80%的深拷贝但是 无法实现 function类型的 深拷贝现在
2022-07-01 16:12:43
275
原创 element-ui 表格总计有多行的情况
element-ui 表格总计 多行官网文档里面 表格的 自定义 总计，但是只能返回单行总计；如果需求需要 多行总计，着实不知到怎么办了，上网查了，这个自定义方法可以返回 html,所以就此粗暴的解决了 多行总计...
2022-06-30 16:44:39
931
原创 移动端字体适配
1. 使用 vw 和 rem 实现移动端适配rem 是 根元素 html字体大小的倍数，只跟根元素字体大小有关。如果浏览器默认字体是 16px (根元素html的font-size = 16px)，那 1rem = 16px;这样如果屏幕改变时，只需要修改html元素的font-size 就可以实现等比适配，但是貌似实际开发中并不需要字体等比适配，基本移动端字体都是 16px 或者 14px。 (也有可能是我见识少)vw 是把屏幕分成 多少等份，100vw就是 把屏幕分成 100等份；（怎么感觉跟 %一样，
2022-06-15 11:52:09
2301
原创 HTML 5
metahttp-equiv属性//强制浏览器按照特定的版本标准进行渲染,但不支持IE7及以下版本。// 如果是ie浏览器就用最新的ie渲染，如果是双核浏览器就用chrome内核。<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'> name属性// 在移动设备浏览器上，禁用缩放（zooming）功能，用户只能滚动屏幕<meta name=”viewport” content=”width=d
2022-05-31 09:59:31
207
1
原创 简单搞一个node服务器
使用 CORS： cors是express提供的第三方库，通过安装和配置cors中间件，可以很方便的解决跨域问题，由一系列HTTP的响应头组成，这些HTTP响应头决定浏览器是否阻止前端JS代码跨域获取资源。运行： npm i express， 会生成一个 node_modules文件夹，package-lock.json里面也会写入很多 依赖的信息。2.导入中间件 const cors = require("cors")3. 配置中间件 app.use("cors()")1.安装： npm i cors。.
2022-05-23 16:57:34
393
原创 vue render函数里面渲染 v-html
要用 domProps, 可以用 slot插槽render: (h, { row }) => { return h('div',{ style: {}, slot: 'content' },[ h("span", { domProps: { innerHTML: row.htmlStr, }, } ]
2022-05-09 18:54:38
1951
原创 React 学习笔记
1. react- 用于构建用户界面的javaScript 库react 是一个将数据渲染微HTML视图的开源 JavaScript库2. facebook开发，且开源3. 原生JavaScript 原生javaScript操作DOM繁琐、效率低（DOM-APL 操作 UI)。 使用javascript直接操作DOM,浏览器会进行大量的重绘重排。 原生JavaScript没有组件化编码方案，代码复用率低。4. react 特点 react 核心库和re
2022-04-25 19:24:53
4606
原创 ‘webpack-dev-server‘ 不是内部或外部命令,也不是可运行的程序
运行项目，出现以下 'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序，解决：npm install webpack-dev-server --save-dev这一操作会 更新webpack-dev-server 版本，会重新下载安装webpack-dev-server如果你不想下载其他的版本，可以先删除 node_models, 重新安装...
2022-04-11 15:34:33
19532
1
原创 vue 手脚架创建 项目
vue2 手脚架创建npm init ： 初始化 npm,一直回车，会生成一个 package.json文件vue init webpack vue2_demo2: 创建项目创建成功，项目结构如下：vite + vue3 手脚架创建nom init: 初始化 npmnpm init vite@/latest vue3_demo --template vue : vite 快...
2022-03-31 19:27:14
1211
原创 Git 分布式版本控制
git常用的 命令 add 添加缓存 git add . commit 保存缓存, -m 后面是提交的描述（你随便写） git commit -m 'modify' push 提交 缓存 git push pull 拉去版本库的代码 git pull clone 克隆远程的 项目代码 git clone http://你自己的仓库链接 checkout 切换分支 git checkout 分支名n...
2022-03-29 19:04:24
350
原创 VUE3+vite
vue3 新特性 + vite防抖和节流Vue 没有内置支持防抖和节流，但可以使用Lodash等库来实现。如果某个组件仅使用一次，可以在methods中直接应用防抖：<script src="https://unpkg.com/lodash@4.17.20/lodash.min.js">&...
2022-03-24 19:21:56
4240
原创 js函数中的形参和实参
形参和实参是存在一种引用关系的，就好比变量中的引用关系。我们都知道，变量中的引用关系跟它们的值有关。当值为原始类型时(string,number,boolean，int等等)，var a=b是各自引用不同的内存地址的，修改不会影响到彼此；当值是对象，数组等非原始类型时，它们引用的是同一个内存地址，修改则会相互影响。所以当 函数中的形参是 原始类型，就不会影响到实参的值，因为引用的是值当函数中的形参是 对象类型，引用的是地址，会影响实参。...
2022-03-14 10:25:52
1085
原创 url参数含有特殊字符无法正常获取
encodeURLComponent() 可以把字符串作为URL组件进行编码。该方法不会对ASCLL字母和数字进行编码，也不会对一些ASCLL标点符号进行编码：-_!~'()其他字符都是由一个或者多个十六进制的转义序列替代的。下面url地址 进行编码：var uri="https://www.runoob.com/my test.php?name=ståle&car=saab";document.write(encodeURIComponent(uri));输出为：
2022-03-01 12:00:52
1398
原创 electron
1. 首先新建一个 git仓库: git init 回车git init2. 安装electron库npm install electron --save-dev --save-exactvue.this.$forceUpdate() 处理页面刷新问题，强制刷新
2022-02-08 10:52:34
1270
原创 JS-数组方法梳理
1. pop() 从后面删除一个元素2.push() 从后面添加一个元素3.shift() 从前面删除一个元素4.unshift() 从前面添加一个元素5. delete() 会留空洞，删除属性，数组也是对象，可以用delete删除，但是会流空洞；6. sort() 排序，字符串排序，但是数值排序不准,数值排序可以这样排序：array.sort((a, b) => { return a-b;})对象数组排序：var cars = [ {type:"
2021-09-29 18:13:49
141
原创 iview里面的select 组件v-model为空时，回调的时是undefined
iview里面的select 组件数据重置之后，会回调一个 undefined, 因为select里面的v-model会自动匹配 option的值，当v-model为空时，在option中找不到这个值，匹配不上，就会回调undefined.解决方法： 给v-model的变量赋初始值（这个初始值必须是option里面能找到的值，可以匹配得上的），如v-model=‘option’<!--option 里面多加这行，匹配初始值的情况--><Option value="0" label=
2021-09-28 16:22:41
2176
原创 后台管理系统常用的结构
后台管理系统常用的结构<template> <div id='app'> <header class="app-header"> <xy-header></xy-header> </header > <div class="app-body"> <div class="app-left" v-show="menuShow"> <xy-
2021-05-19 09:30:50
281
原创 富文本编辑器
富文本编辑器1. 下载npm i wangeditor --save2. .html<el-form-item label="简介" prop="describe"> <div class="video-input" v-if="videoDialogVisible"> <div id="editorElem" ..
2021-05-19 09:23:41
268
原创 uncaught TypeError: $export is not a function
今天被这个bug 搞崩溃了，在网上找了资料，还是报错，终于看到能解决问题的帖子了，结合我的问题，记录一下！！！！！网上很多都是说在 加上 这个代码即可：忽略编译node_modules文件夹，但是我试了，还是不行{test:/\.js|jsx$/,use:'babel-loader',exclude:/node_modules/},终于发现了问题，即下面这张图， 删掉下面一个红框代码就可以了为什...
2021-03-20 17:18:31
995
原创 MySQL8.0.17 密码重置
太久没玩MySQL了，密码都忘记了，无奈只能重置密码，git it!!! 亲试有效在MySQL安装路径的下找 my.ini 文件，记事本打开，在 [mysqld]下面添加skip-grant-tables 保存退出后重启mysql，使用 MySQL -u root -p 回车即可登录mysql 使用设置密码字段为空（在MySQL8.0.17中没有password字段，只有authentication_string）use mysql; (使用mysql数据表)update user s...
2021-02-13 00:23:37
472
1
原创 改样式神器之chrome浏览器
作为一个审美不太行的前端码农，更喜欢写js，而不喜欢写css [苦涩][捂脸]。参加工作两个月，在项目实践中摸爬打滚，逐渐发现了，最快速，最有效的改样式方法是使用浏览器这个工具协助。以下以chrome浏览器为例：步骤：1.右键打开控制台会出现一下窗口：（随便打开一个网页的哈）最常用的三个选项卡：使用这三个基本上可以搞定开发了，有时候还需要在Application 这里 查看 sessionStorage或者localStorage等详情2. 快速定位要修改css的元素..
2021-01-11 11:53:58
1454
原创 函数也是参数，可以在父子组件中传递
昨天在项目中见识了大佬写的代码之后，我自愧不如，默默地抄起笔记本简单描述：有一个组件X，A功能页面和B功能页面都要用到，但是两个页面向后台请求的接口完全不一样，而点击事件又在组件X内部。有人可能说这简单啊，把地址和data数据通过父子组件的传递方式传过去就好啊（确实我一开始就是这么写的），但是接口太多，数据又很杂，看得眼花缭乱，维护性不好，不采取。经过大佬的键盘一改造，好家伙，直接传函数，把点击事件的函数直接传给子类，给我惊呆了！（因为太菜，没有试过这种写法，像极了没见过世面的乡巴佬 !@_@!）.
2020-12-26 15:50:36
435
4
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人