- 博客(39)
- 收藏
- 关注
RSS订阅原创 React基础详解（一）
Facebook起草的JS扩展语法本质是一个JS对象，会被babel编译，最终会被转换成React.createElement每个JSX表达式，有且仅有一个根节点：React.Fragment每个JSX元素必须结束（XML规范）
2023-11-03 15:38:38
307
原创 iframe的替代品
面试题：使用过iframe框架，那你对于iframe框架的优缺点知道多少？并且由于iframe的一些缺点，国内外针对这个框架的替代品你知道有哪些呢？
2023-03-21 08:59:24
3032
2
原创 前端面试题（四） -- JS
1）var定义的变量，没有块的概念，可以跨块访问，不能跨函数访问，有变量提升；2）let定义的变量，只能在块作用域里访问，不能跨块访问，也不能跨函数访问，无变量提升，不可以重复声明。3）const用来定义常量，使用时必须初始化（即必须赋值），只能在块作用域里访问，而且不能修改，无变量提升，不可以重复声明。另一种回答：var 会挂载window，let、const不会；var存在变量提升，let、const不会；let、const存在块级作用域；
2023-02-23 17:54:54
274
原创 前端面试题（六）-- Vue
但是和渲染函数不同，为计算属性创建的Watcher不会立即执行，因为要考虑到该计算属性是否会被渲染函数使用，如果没有使用，就不会得到执行。dirty属性用于指示当前的value是否已经过时了，即是否为脏值，受到lazy的影响，该值在最开始是true，Watcher创建好后，vue会使用代理模式，将计算属性挂载到组件实例中，当读取计算属性市，vue检查其对应的Watcher是否是脏值，如果是，则运行函数，计算依赖，并得到对应的值，保存在Watcher的value中，然后设置dirty为false，然后返回。
2023-02-19 19:47:35
1118
原创 前端面试题（三）--CSS
渐进式渲染，英文名称progressive rendering，也被称之为惰性渲染，指的是为了提高用户感知的加载速度，以尽快的速度来呈现页面的技术。但是这并不是某一项技术的特指，而是一系列技术的集合。例如：骨架屏、图片懒加载、图片占位符、资源拆分。CSS渲染性能的优化来自方方面面，这里列举一些常见的方式：1）使用id选择器非常高效，因为id是唯一的；2）避免深层次的选择器嵌套；3）尽量避免使用属性选择器，因为匹配速度慢；4）使用渐进增强的方案；5）遵守CSSLint规则；
2023-02-13 15:49:53
414
原创 前端面试题（二）--CSS
居中分为两种，一个是水平居中，另一个是垂直居中水平方向居中，有两种方式：1）设置盒子margin:0,auto;这种居中方式的原理在于设置margin-left为auto时，margin-left就会被设置为能有多大就设置多大，所以盒子会跑到最右边，而设置margin-right为auto时，同理盒子会跑到最左边。所以，当我们设置左右的margin都是auto的时候，盒子就跑到了中间，从而行成了水平居中。
2023-02-10 19:48:46
285
原创 前端面试题(一)--HTML
它是HTML的文档声明，通过它告诉浏览器，使用哪一个HTML版本标准解析文档。在浏览器发展的历史中，HTML出现过很多个版本，不同版本在元素、属性等书写格式上略有差异，如果不预先告诉浏览器，浏览器就不知道我们的文档标准是什么，在这种情况下，大部分浏览器将开启最大兼容模式来解析网页，我们称之为怪异模式，这不仅会降低解析效率，而且会在解析过程中产生一些难以预知的bug，所以文档声明是必须的。而文档声明有多种书写格式，对应不同的HTML版本，
2023-02-09 14:26:20
72
原创 Invalid prop: type check failed for prop “maxLength“. Expected Number, got String.
问题背景：使用Element-ui of Vue的input的maxlength属性报错。
2022-12-01 11:20:01
357
原创 抓包工具--Fiddler
Fiddler是位于客户端和服务器端的HTTP代理，目前最常用的http抓包工具之一，功能非常强大，是web调试器的利器；它是一款简单的接口测试工具，发HTTP/HTTPS数据包工具功能：1、监控浏览器所有的HTTP/HTTPS流量2、查看、分析请求内容细节3、伪造客户端请求和服务器响应4、测试网站的性能5、解密HTTPS的web会话6、全局、局部断点功能7、第三方插件使用场景：1、接口调试、接口测试、线上环境调试、web性能分析。
2022-10-21 13:53:24
2702
原创 添加VSCode头部作者信息和函数信息
很多教程到上面两步就结束了，并告诉我们可以使用快捷键ctrl + alt + i 生成头部注释，ctrl + alt + t 生成函数注释，但是快捷键没有进行修改的话，是无法生成的，以下是快捷键修改的方式；在扩展中搜索插件koroFileHeader，点击下载；
2022-09-23 15:18:10
849
原创 iframe框架中src相对路径问题
vue项目中使用的iframe框架，需要内嵌一个静态页面，使用的相对路径，本地运行没有问题，但是打包之后报错404
2022-09-15 13:38:50
4162
2
原创 代码迁移过程 -- Gitee to GitHub
由于最开始使用git绑定的是gitee，只能创建私仓，如果要公开还需要审核，而github可以直接创建公开仓，因此今天将代码转移到github上，记录一下踩坑经历。
2022-08-25 11:17:25
1074
原创 VUE的diff算法
在对比其子节点数组时，vue对每个子节点数组使用了两个指针，分别指向头尾，然后不断向中间靠拢来进行对比，这样做的目的是尽量复用真实dom，尽量少的销毁和创建真实dom，如果发现相同，则进入和根节点一样的对比流程，如果不同，则移动真实dom到合适的位置；具体来说，首先对根节点进行对比，如果相同则将旧节点关联的真实dom的引用挂到新节点上，然后根据需要更新属性到真实dom，然后再对比其子节点数组，如不相同，则按照新节点的信息递归创建所有真实dom，同时挂到对应虚拟节点上，然后移除掉旧的dom；...
2022-08-15 16:44:02
452
原创 vue中 $router 和 $route 的区别
当需要在一个页面中嵌套子路由，并且页面不跳转的时候，只需要将子页面渲染在 router-view 里面。2. 导入 vue, vue-router，并定义路由，每个路由包含一个 component 属性，这个属性映射一个组件 --- router.js。4. 在 vue 根实例中注入路由，这样就可以在其他任何组件中访问路由了 --- main.js。匹配到的路由记录，包含当前路由的 path, name, params, query 等属性。：当前激活的路由的信息对象。解析得到的信息，还有。...
2022-08-11 13:21:14
308
原创 ERROR:Module not found: Error: Can‘t resolve ‘core-js/modules/es.promise.js‘ in ‘address‘
原因：未安装core-js在package.json所在目录执行如下命令 ：
2022-08-08 16:39:49
675
原创 scoped穿透:VUE+Element-UI的组件样式修改
在使用Element-UI组件编写时，发现样式需要修改，那么就需要使用穿透来进行修改，以下是不同预处理语言下可以使用深度访问（样式穿透）功能的方法：如果Vue项目中style的 lang 是 css，那么：但是有时候 这种写法不会被 scss 或 less 预处理器识别。如果Vue项目中style的 lang 是 less，那么：3. ::v-deep如果Vue项目中style的 lang 是 scss，那么：Tips:如果需要穿透修改，那么在穿透时，style中的scoped也是必
2022-08-06 22:16:10
819
原创 Vue 3
1、什么是hook：本质是一个函数，把setup函数中使用的Composition API进行了封装；类似于vue2中的mixin2、自定义hook的优势：复用代码，让setup中的逻辑更加清楚易懂。
2022-08-02 17:44:58
1172
原创 VUE基础（V2）
1、定义语法newVue({{指令名配置对象}})或newVue({})Vue.directive(指令名，配置对象)或Vue.directive(指令名，回调函数)2、配置对象中常用的3个回调函数1）.bind指令与元素成功绑定时调用指令所在元素被插入页面时调用3）.updated指令所在模板结构被重新解析时调用3、备注1）指令定义时不加v-,但使用时要加v-2)指令名如果是多个单词，要使用kebab-case命名方式，不要使用camelCase命名方式。...
2022-08-01 16:06:43
915
原创 babel&ESlint
babel是一个转码器，比如可以将ES6的代码转换为ES5的代码，从而在适配环境下运行。是一款可组装的JavaScript和JSX检查工具。eslint是一个代码规范工具，可以帮助我们统一规范的写代码；
2022-07-21 12:28:22
1047
原创 yarn 的使用
tagtag就是发布包版本时为这个版本打上的标签，这样用户可以直接使用标签进行安装此版本的包，不用输入版本号。peerDependencies是指对等依赖环境，拥有对等依赖意味着你的包需要一个与安装你的包的人完全相同的依赖。optionalDependencies是指可选的依赖项。devDependencies是指开发环境。...
2022-07-21 11:16:53
817
原创 vue-router安装报错
在安装vue路由时发现如下报错：其中我们特别注意：npm ERR! peer vue@"^3.2.0" from [email protected]因为2022年2月7日以后，vue-router的默认版本，为4版本，而且 vue-router4,只能在vue3中，只有vue-router3中，能用在vue 2中如果把vue-router4强制安装到vue2中，则会报上面的错误；vue2正确安装方法：......
2022-07-12 15:09:24
5108
原创 笔 记
真正推动计算机形成自有的工程学体系的是还有两样东西就是：因为人的能力并没有“跟上”机器，所以才会出现各种模式、方法、工具等等来补足人的不足，以最大地透支机器性能。就像我前几天在闪存无聊时突然想到的一句： 架构是对客观不足的妥协，规范是对主观不足的妥协。当我们需要机器做的事情多了起来，我们就没办法在一个芯片上解决所有事情，所以才会有冯诺依曼模型、计算机架构，没办法用一台机器解决，所以才要互联网、分布式、云计算。同样，随着计算机的发展，要做的事情多了，就出现了软件的概念。当“开发”正式化，我们需求的软件就变得：
2022-07-11 18:12:52
57
原创 网页右边没有滚动条，内容超出也看不到怎么办？
遇到的问题：博主正在进行vue组件开发，将主页面添加了组件之后，发现在浏览器中打开内容超出但没有滚动条解决方法：我们可以找一下css中的设置，去掉 html和body中的overflow:hidden；即可！...
2022-07-08 21:28:08
4619
原创 We’re sorry but （项目名称） doesn’t work properly without JavaScript enabled/Vue路由history模式跳转报错404--解决方案
遇到的问题：本地开发环境，项目是vue-cli创建的，访问接口状态为200，但没有正确返回数据，返回信息提示为“We’re sorry but example doesn’t work properly without JavaScript enabled. Please enable it to continue.”搜索全局发现打包之后的dist目录下 index.html 中有一句一模一样的文字，说明请求返回了index页面；网上搜索一番发现，可能是server配置不对，没有匹配到要请求的路径。如果是开
2022-07-08 21:00:51
14467
原创 工程化-less\sass\webpack
css预编译器（less、sass）less是一种更加简洁的样式代码，它非常像css，但又不太一样，它让编写样式变更容易less常用的功能：变量、嵌套、混合less代码虽然好，但是他无法被浏览器识别，因此需要一个工具将其转换为纯正的css代码由于node环境具有读写文件的能力，于是在node环境中可以轻松的完成文件的转换，npm上有一个包叫做less，less包提供了一个cli工具lessc ,它运行在node环境中，通过它可以完成对less代码的转换lessc index.less index.css安装
2022-06-23 16:21:52
239
原创 模块化-CMJ&ESM
CommonJS 重点AMDCMDES6 模块化 重点每个模块尽量简洁，不超过50行代码，便于维护和复用，避免全局污染nodejs直接运行某个js文件，该文件被称之为入口文件；nodejs 遵循es标准，单由于脱离了浏览器环境，因此：1、你可以在nodejs中使用es标准的任何语法或api，例如：循环、判断、数组、对象等2、你不能在nodejs中使用浏览器的web api，例如：dom对象，window对象，document对象等模块：模块就是一个js文件，它实现了一部分功能，并隐藏自己的内部实现，同时提供
2022-06-23 16:19:45
309
原创 网络基础知识
CDN :content delivery network内容分发网络，就是提供很多的服务器，用户访问时，自动就近选择服务器给用户提供资源网络：在网络的世界里，两个应用程序之间经常会发生通信在大部分情况下，通信总是由一方发出一个消息开始，而另一方回复一个消息结束发出消息的一方称之为客户端Client，发出消息的过程称之为请求Request回复消息的一方称之为服务器Server,回复消息的过程称之为响应Response这个过程中，有几个点需要特别注意：1、不管是客户端，还是服务器，它们都是一个应用程序，而不
2022-06-23 16:15:55
149
原创 包管理工具
模块（module）：通常以单个文件形式存在的功能片段，入口文件通常称之为入口模块或主模块库（library，简称lib）:以一个或多个模块组成的完整功能块，为开发中某一方面的问题提供完善的解决方案（例如jquery这个库是为了解决获取dom对象难的问题；mockjs是模拟数据进行测试的）包（package）:是一个或多个js模块的集合，包含元数据的库，这些元数据包括：名称、描述、git主页、许可证协议、作者、依赖等（有的包是给别人用的，这种包称之为第三方库）包管理工具：1、让开发者可以轻松的下载包2、让开
2022-06-23 16:13:07
595
原创 C3&H5&ES6
1、一个固定的盒子，宽高不固定，将它居中，可以使用transform属性，translate:（50%,50%）就是移动它自身的高度的50%和宽度的50%2、c3的视觉常用：阴影，圆角，渐变，变形（transform里面包含translate平移、scale缩放、rotate旋转）、过渡（transition）、动画@keyframes jump{}定义动画，然后在元素中animation:jump进行引用函数、box-sizing：border-box、 图片自适应：object-fit:cover、视口
2022-06-23 16:06:05
260
原创 JS收官笔记
声明式语言：html css sql命令式语言：c c++ java python js(命令式语言本质是处理数据)1、数据表达js提供了三种方式来表达一个数据：变量、字面量(直接书写的数据）、表达式【程序中任何需要数据的地方，都可以使用上面任意一种数据表达】2、标识符：程序中有些可以自行命名的地方，称之为标识符，常见的标识符有：变量名，函数名，参数名js标识符必须符合一下规则：1）允许数字、字母、下划线、$符号2）不得以数字开头3）不能和关键字冲突4）建议使用驼峰命名法5）不能有空格，不能有—符号名称尽量
2022-06-11 11:10:17
122
原创 淘宝项目练习总结
1、PRD前端FE（front-end）图片样式是设计UI给到的PRD图片，一些比较好的设计师会给到图片标注图，根据图片上距离进行写页面2、项目准备工作首先看页面结构，在index.html入口文件中把结构写下来，看看有几个结构，然后再进行细分把对应的重置样式在reset.css中把对应的标签进行重置样式3、小经验1）样式重置与模块化reseat样式表，自己填写相应内容进行重置，一般一个大项目之前都会有人写好或者规定好样式重置内容，后续进行直接引用，尽量减少嵌套，这样方便网站SE
2022-05-17 10:14:22
131
原创 Ajax Axios
1、AJAX（Asynchronous Javascript And Xml）就是浏览器赋予JS的一套API，通过这套API能够使JS具备网络通信的能力;IE使用了一套API来完成请求的发送，这套API主要依靠一个构造函数完成。该构造函数的名称为XMLHttpRequest,简称为XHR，所以这套API又称之为XHR API；后又更新了一套更加完善的API来发送请求，这套API主要使用的是一个叫做fetch的函数，因此这套API又称之为Fetch API1）XHR APIvar xhr
2022-05-17 10:05:11
104
原创 Git基本操作
1、Git是分布式版本控制系统功能一：管理不同版本，回退到任何时刻功能二：方便协同开发2、Git基本命令git初始化：git initgit暂存：git add .(全部暂存)git暂存某一个文件：git add 文件名字git提交代码：git commit -m '备注信息'git提交历史记录：git loggit操作记录：git refloggit撤销提交：git reset HEAD~git撤销提交到某一个版本：git reset --hard 版本号g
2022-05-16 14:48:09
60
原创 Linux上安装Nginx静态资源服务器
1、下载依赖yum -y install pcre*yum -y install openssl*2、下载wget(类似于迅雷，用来下载文件的)yum install wget3、下载Nginxwget http://nginx.org/download/nginx-1.21.1.tar.gz4、解压tar zxvf nginx-1.21.1.tar.gz5、进入到解压后的目录，编译./configure6、编译之后安装make i.
2022-05-16 13:57:33
661
原创 python笔记
缩进：1个Tab键和4个空格键不一样反缩进：Shift+Tab键注释：Ctrl+/;或者 #号键多行注释：‘‘‘’’’进制：0x开头表示16进制数；x是hex十六进制0o开头表示8进制数；o是oct八进制0b开头表示2进制数；b是bin二进制截取字符串中的一部分，遵循左闭右开原则，str[0:2] 是不包含第 3 个字符的...
2022-05-15 18:56:09
120
原创 CSS学习笔记
h1 { color: red; background-color: lightblue; text-align: center; }css:为网页添加样式；cascading style sheet层叠样式表css规则=选择器+声明块引入CSS的方法1、行间样式，在标签里面加入style2、页面级CSS：在head里面写入style3、外部CSS文件：在head里面写入link...
2022-04-30 13:45:26
458
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人