- 博客(62)
- 收藏
- 关注
RSS订阅原创 ios上使用100vh隐藏的问题
100vh：表示浏览器的最大视口高度，部分浏览器会包含底部功能区的高度，就导致了部分机型上会高于文档的可见部分。（当滑动浏览器时搜索栏部分会收起，会让可视区域变大。）100%：针对父元素的百分比。如果 body 没有设置明确的高度，那么 100% 会相对于其最近的非静态定位的祖先元素，如果没有这样的祖先元素，它将相对于初始包含块（通常是可视区域高度，不包含功能区高度）。
2023-12-18 19:42:48
522
原创 初识 Vite
Vite（法语“快速”） 是一种构建工具，旨在利用浏览器生态中的新进展解决上述问题：浏览器开始原生支持 ES 模块，且越来越多 JavaScript 工具使用编译型语言编写，提供**快速的开发体验**。
2023-12-18 11:34:15
1064
原创 提效工具：揭秘VS Code Copilot与Labs、Chat的完美结合
在如今高速发展的前端开发领域，VS Code Copilot与GitHub Copilot Labs共同构成了无与伦比的代码助手联盟。本文深入探讨了这些强大的工具如何通过智能代码提示、自动生成代码以及卓越的代码review能力，为开发者提供了全方位的支持。我们还将介绍GitHub Copilot Chat，一款出色的代码review插件，让你的团队协作更加高效。跟随我们一同揭秘这些备受赞誉的工具，提升你的前端开发效率，成为编码领域的佼佼者！
2023-07-15 12:39:53
2422
2
原创 前端上传图片的数据处理
上传图片 & 获取File对象。File 、base64、Blob间数据相转换。base64格式的图片数据直接设置为 img 的src属性值，可实现预览功能
2022-10-24 19:00:19
773
1
原创 useCallback的基本使用
函数式组件中，useCallback对函数进行缓存，组件再次更新时会根据依赖是否变化决定选用缓存函数还是新函数。一般会在嵌套组件中，与函数式组件的memo和类组件的PureComponent一起使用【会对传入props参数逐个进行浅比较决定是否需要更新】，来提高页面性能。
2022-03-17 20:18:46
12506
1
原创 useEffect的基本使用
函数式组件useEffect为模拟class组件的生命周期钩子副操作；侧重effect和return销毁函数的执行时机
2022-03-17 20:11:21
859
原创 useState的基本使用
useState的基本使用：setXXX属于异步更新，传参最好是函数方便多次setXXX时状态复用，注意传入新对象才会触发更新。
2022-03-17 20:08:57
1881
原创 Vue核心模块讲解
对Vue的各个核心模块进行介绍，包括：Vue.mixin的合并策略、nextTick、keep-alive、数据响应式、自定义指令、Vue.use注册插件、Vue.extend生成组件等
2022-01-10 15:08:28
731
原创 给所有使用el-table组件特定列添加统一事件及样式
在项目中所有使用el-table表格的地方，对【项目名称列】添加点击事件及样式【触发某个弹窗显示并在该列添加 `cursor: pointer;` 等样式】
2021-12-22 21:25:59
1395
原创 你不知道的JavaScript【上】总结
目录一、作用域1.1 编译原理1.2 理解作用域1.3 作用域嵌套/作用域链1.4 异常二、词法作用域2.1 词法阶段2.2 欺骗词法作用域2.2.1 eval(..)2.2.2 with关键字三、函数作用域和块作用域3.1 函数中的作用域3.2 隐藏内部实现3.3 函数作用域3.4 块级作用域3.4.1 with3.4.2 ES3的try/ catch3.4.3 let、const四、提升五、闭包六、作用域总结七、关于this1.1 绑定规则1.2 绑定空对象1.3 箭头函数八、对象2.1 深拷贝2.2
2021-12-18 22:32:32
1278
原创 JavaScript常见设计模式【简短、通俗易懂】
道： 核心思想：封装变化—— 将变与不变分离，确保变化的部分灵活、不变的部分稳定。 SOLID设计原则： - 单一功能原则（Single Responsibility Principle）【前端着重】 - 开放封闭原则（Opened Closed Principle）【前端着重】：对拓展开放，对修改封闭。软件实体（类、模块、函数）可以扩展，但是不可修改 - 里式替换原则（Liskov Substitution Principle） - 接口隔离原则（Interface Segreg.
2021-11-23 09:49:43
129
原创 vue中出现报‘xxxxx‘ is defined but never used”问题解决
在vue3中 vue add typescript 安装完ts声明函数时参数报了这个错：‘xxxxx‘ is defined but never used解决办法一：interface People { name: string, age: number, sex?: string, // eslint-disable-next-line play(value: string): void }解决办法二：//package.json中添加"eslint
2021-11-21 18:51:43
1543
原创 浏览器中需要掌握的奇怪知识~
1. console.log同步还是异步？并没有什么规范或一组需求指定console.* 方法族如何工作——它们并不是JavaScript 正式的一部分，而是由宿主环境（请参考本书的“类型和语法”部分）添加到JavaScript 中的。因此，不同的浏览器和JavaScript 环境可以按照自己的意愿来实现，有时候这会引起混淆。尤其要提出的是，在某些条件下，某些浏览器的console.log(…) 并不会把传入的内容立即输出。出现这种情况的主要原因是，在许多程序（不只是JavaScript）中，I/O
2021-10-18 22:19:37
4451
2
原创 Chrome性能分析工具的使用
运行时性能表现（runtime performance）指的是当你的页面在浏览器运行时的性能表现，而不是在下载页面的时候的表现。这篇指南将会告诉你怎么用Chrome DevTools Performance功能去分析运行时性能表现。在RAIL性能评估模型下，你可以在这篇指南中可以学到怎么去用这个performance功能去分析Response, Animation, 以及 Idle 这三个性能指标。一、模拟移动设备的CPU移动设备的CPU一般比台式机和笔记本弱很多。当你想分析页面的时候，可以用CPU控制
2021-10-14 18:05:07
3819
原创 带你了解Chrome性能监测~
描述：通过勾选复选框展开表格项目单项，936ms将近1s的延迟后界面呈现效果【数据量大时可能延迟更高】。表头40列，通过最后一列动态控制要渲染的表头数据，默认只展示了 14列。每页展示20条项目，展开后56条。后台传过来的数据Array，每个Object中包含要使用的至少40个属性。涉及公司项目，全部关键部分已模糊处理一、工具： Chrome、vue项目、ScreenToGIf软件二、问题：（1）复选框状态改变和表格基本延迟后统一改变的； 疑问：vue优先事件执行js，后渲染页面.
2021-10-14 14:23:49
1779
原创 React 类组件和hooks函数式组件对比
在学习时，先接触的class组件之后才是带有hooks的函数式组件。可能是自己大脑更偏向于有了这种方式解决干嘛又要学另外的，自己也比较清楚this的指向问题，所以就更偏向于使用class组件。可是，视频课以及各种文章都在推崇hooks，打算静下心来了解一下两者区别（目前未进行过react项目开发，仅仅代表当前阶段的认知，轻喷~）React的class组件和有hooks后的函数式组件都可以进行内部状态保存及生命周期的执行。类组件函数式组件性能class编译es5后会多出一堆辅助.
2021-10-11 11:38:31
1029
原创 webpack4 【开发】【生产】【优化】相关配置
自动化构建（一）npm scriptsnpm允许在package.json文件里面，使用scripts字段定义脚本命令{ // ... "scripts": { "build": "node build.js" }}命令行下使用npm run命令，就可以执行这段脚本。$ npm run build# 等同于执行$ node build.js$ npm run //查看所有脚本命令之前项目弊端网页加载速度慢，因为会发起很多的二次请求（html中引入css、j
2021-09-30 16:25:28
154
原创 JavaScript修改原生类型【prototype】出现的问题
通过demo测试，本想用来扩展其功能，发现JavaScript无法修改原生类型的原型指向prototype，包括：String、Number、Array等。
2021-08-20 15:54:06
732
原创 浅析浏览器是如何工作的
浅析浏览器是如何工作的一、渲染引擎主流程：HTML解析生成解析树 `DOM树`CSS解析生成样式表 `CSSOM`JavaScript解析构建渲染树 `layer tree`布局 `layout tree`绘制总结：二、JS引擎（JS解释型语言，运行时类型检查）一、渲染引擎主流程：HTML解析生成解析树 DOM树首先将文档转换成另一种格式；词法分析器：将输入内容分解成一个个有效标记。HTML解析器：根据语言的上下文相关语法规则分析文档的结构，两两配对，构建解析树。解析算法：边识别标记，边传递
2021-07-26 18:19:22
167
原创 Runtime-Only 和 Runtime-Complier区别
通过vue脚手架创建Runtime-Only 和 Runtime-Complier两种不同项目，进而对比文件中的不同点及运行性能，得出实际开发中推荐的写法。
2021-06-15 17:14:07
358
9
原创 v-show、v-if、display:none的区别（推荐的父子模板写法）
子组件v-if=“false”，父组件无法调用子组件的方法（一） 尽可能避免的写法 // 父组件 (这样写模态框会被记载到父组件中) <a-modal title="用户信息完善" v-model="showModal" width="35%"> <user-info-complete ref="infoModal" v-if="showUserInfo"></user-info-complete> </a-modal> // 请求该方法
2021-03-30 08:48:25
225
原创 生命周期中包含有异步请求（阻塞、不阻塞）
（一）钩子函数（8大生命周期） 1. beforeCreate 2. created：**$data、data中的数据、methods中的方法已创建完成** 3. beforeMount 4. mounted：**$el创建完成并替换了DOM元素** 5. beforeUpdate 6. updated：**data中数据发生改变，会触发对应组件的重新渲染（beforeUpdate和updated没看出区别）** 7. beforeDestroy：**销毁前、实例可用** 8
2021-03-30 08:36:18
1037
原创 oracle11 + instantclient + plsql 安装及配置
oracle、instantclient、plsql1.安装oracle 11.2.0.4.0 （64位）官网下载 ，下载的两个解压到一起（合计2G多）2.instantclient 11.2.0.4.0 （默认32位）官网下载 ， 解压3.PL/SQL Developer 9.0.6（默认32位）官网下载4.配置文件修改https://blog.csdn.net/qq_26230421/article/details/79047527（拷贝到 instantclient_11_2\NE
2020-08-19 21:20:04
684
3
原创 【小白】如何熟练使用Git（命令）
四个区域常用命令（一）新建代码库（工作区）（二）工作区<---->暂存区（三）暂存区<---->版本库（四）远程仓库参考文章（一）新建代码库（工作区）# 在当前目录新建一个Git代码库git init# 新建一个目录，将其初始化为Git代码库git init [project-name]# 下载一个项目和它的整个代码历史git clone [url]# 查看暂存区和本地仓库指定文件的差别git status [filename]# 查看暂存区和本地仓库的差别gi
2020-06-18 16:15:35
310
原创 new String("ab") 和 new String("1")+ new String("1")的区别以及intern()讲解
参考文章 ：https://www.cnblogs.com/fenjyang/p/11451772.htmlhttps://blog.csdn.net/qq_29951485/article/details/92785590?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.nonecase&depth_1-utm_source=distribute.pc_relevant.no
2020-05-10 21:46:03
267
原创 面试前的准备:好文章收集
DataBase索引聚集索引和非聚集索引b树，b+树，b*数据库索引是什么MySql的InnoDB和MyISAM自我总结：一、聚簇索引决定表中每条数据物理存储的位置（磁盘中的位置，以盘块进行分块存储）。非聚簇索引性能的好坏由读取盘块的数量决定（即聚簇索引最初决定的存储位置）（1）在主键上建立聚集索引，在fariq上建立非聚集索引： 在id上建立聚集索引，那么磁盘中每条...
2020-01-18 18:07:45
198
原创 Docker常用命令
Docker安装安装docker： yml install docker启动docker: systemctl start docker将docker服务设置开机自启动： systemctl enable docker镜像操作检索： docker search tomcat拉取： docker pull tomcat:latest列表： docker images删除： dock...
2020-01-09 11:25:57
89
原创 代码及本地文件中斜杠“ / ”和反斜杠“ \ ”的区别
1.浏览器中2.系统中斜杆和反斜杠在大多数情况下可以互换3.项目中尽量多使用斜杠 / ，网络文件路径必须使用斜杠 /
2019-12-08 22:03:30
1670
转载 Spring MVC原理及配置详解
【Spring】Spring MVC原理及配置1.Spring MVC概述：Spring MVC是Spring提供的一个强大而灵活的web框架。借助于注解，Spring MVC提供了几乎是POJO的开发模式，使得控制器的开发和测试更加简单。这些控制器一般不直接处理请求，而是将其委托给Spring上下文中的其他bean，通过Spring的依赖注入功能，这些bean被注入到控制器中。Spring...
2019-12-08 21:12:49
113
原创 Spring核心讲解-AOP-DI
前言最近在学习spring boot，反过来复习下spring的知识，加深对spring boot的理解。依赖注入DIWhat控制翻转（IOC）是通过依赖注入（DI）实现。依赖注入指的是容器负责创建对象和维护对象间的依赖关系，而不是通过对象本身负责自己的创建和解决自己的依赖。目的：解耦。（组合 相比于 继承 能使耦合度大大降低。）HowSpring IoC容器（Applicat...
2019-12-08 20:13:44
117
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人