Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                

自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(154)
  • 问答 (1)
  • 收藏
  • 关注

原创 husky 工具配置代码检查工作流:提交代码至仓库前做代码检查

提示:这篇博客以我前两篇博客作为先修知识,请大家先去看看我前两篇博客。

2024-09-08 09:53:25 259

原创 前端 Vue3 项目开发—— ESLint & prettier 配置代码风格

如果你用的是 pnpm create vue 来创建项目,那么创建项目时就会让你选择是否添加 ESLint 和 prettier如果说 ESLint 是为了使代码更加规范,那 prettier 的引入则是为了使代码更加美观。

2024-09-07 09:43:52 433

原创 JavaScript前端面试题——JS 中 Map 和 WeakMap 有什么区别 ?

为了避免有小伙伴和我一样连 map 和 weakmap 是什么都不知道,我在这里详细介绍一下。Map和WeakMap是 ECMAScript 2015(ES6)引入的两种数据结构,用于改进键值对的管理方式。Map:适用于需要保持键值对插入顺序、允许多种数据类型作为键、需要遍历和获取大小的场景。WeakMap:适用于需要将对象作为键并确保这些键不会阻止对象被垃圾回收的场景,通常用于存储对象的元数据。

2024-09-06 22:36:14 788

原创 前端 ESlint 代码规范及修复代码规范错误

代码规范:一套写代码的约定规则。例如:赋值符号的左右是否需要空格?一句结束是否是要加分号?虽然不遵守这些代码规范并不会造成语法错误,但是一个团队中,我们通常希望各个团队成员的代码风格是统一的没有规矩不成方圆ESLint:是一个代码检查工具,用来检查你的代码是否符合指定的规则(你和你的团队可以自行约定一套规则)。在创建项目时,我们使用的是代码风格的规则。创建vue项目时可以添加ESLint代码检查工具。

2024-09-06 10:23:30 746

原创 JavaScript前端面试题——深拷贝及浅拷贝

深拷贝和浅拷贝是复制数据结构的两种不同方式。浅拷贝是指创建一个新对象,但仅复制原对象的属性引用,而不是其属性值。即,如果原对象的属性值是对象或数组,浅拷贝后的新对象会引用相同的内存地址,因此修改内层对象会影响到原对象。(简单数据类型拷贝值,引用数据类型拷贝地址)深拷贝是创建一个新的对象,并复制原始对象的所有属性,包括嵌套的对象和数组。这意味着在原始对象或新对象上的更改不会相互影响。

2024-09-05 16:41:42 844

原创 github / gitee 多人协作开发——克隆项目、运行代码、关联远程仓库

在多人协同开发的github项目中,如果是你的队友创建的项目,那么你首先要将项目克隆到本地,这样你才能提交或拉取远程仓库中的代码。

2024-09-04 12:53:56 399

原创 JavaScript前端面试题——JavaScript中如何终止网络请求?

在 JavaScript 中,我们可以通过 AbortController 和 AbortSignal 来中止网络请求。使用 AbortControler 创建一个新的 Abortcontroler对象,然后使用它的 aport0方法来中止请求。在创建请求时,将 AbortControlersignal分配给请求的 siqnal 属性,以便在调用 abort() 方法时取消请求。

2024-08-03 09:20:37 445

原创 JavaScript前端面试题——fetch

什么是fetch?AJAX/axios/fetch的区别fetch核心语法我们为什么要学fetch?提交formdata提交JSON

2024-08-02 11:18:39 945

原创 CSS前端面试题——CSS 中,有哪些方式可以隐藏页面元素?有什么区别?

这些方式的区别在于是否占据空间和是否可见,开发者可以根据实际情况选择不同的方式来隐藏页面元素。

2024-07-25 10:18:55 483

原创 CSS前端面试题——怎么用CSS实现一个宽高自适应的正方形?

这种方法通过设置元素的padding属性来实现宽高比例相等的正方形。假设我们希望正方形的边长为相对于父容器的百分比值,比如50%使用而不是直接使用是因为这种技术可以确保元素是一个正方形,而不会因为内容的变化或者浏览器的调整而失真。

2024-07-25 09:45:35 628

原创 CSS前端面试题之哪些CSS属性可以继承?

在 CSS 中,并不是所有的属性都可以继承。下面是一些常见的可继承属性font-sizefont-stylecolortext-alignvisibility这些属件在父元素中设置后,子元素可以继承相同的属性值。但需要注意的是,这些属性只能继承,而不能被子元素覆盖。此外,并不是所有的 HTML 元素都可以继承这些属性,具体需要查看相关属性的文档。相信有小伙伴已经发现了,所有和字体有关的属性都可以继承。

2024-07-24 16:11:37 632

原创 HTML前端面试题之<iframe>标签

面试题:iframe 标签的作用是什么?有哪些优缺点 ?标签是 HTML中的一个元素,用于在当前 HTML文档中嵌入另一个 HTML文档。它可以在一个 HTML页面中嵌入另一个 HIML页面或其他类型的文档,比如 PDF 文件或视频文件。标签的主要作用是将一个页面嵌入到另一个页面中。例如,在一个页面中嵌入一个地图或一个视频,或者在一个页面中嵌入一个在线表单。都可以使用标签。

2024-07-23 18:05:56 659

原创 前端框架前置知识之Node.js:模块化、导入导出语法、包的概念、npm介绍

什么是模块化?在Node.js中,每一个文件都被视为一个单独的模块概念:项目是由很多个模块文件组成的好处:提高代码复用性,按需加载,独立作用域使用:需要标准语法导出和导入进行使用

2024-07-14 10:12:30 1215

原创 element-ui将组件默认语言改为中文

在main.js中加入以下代码即可。现在组件已经变成中文的啦。

2024-06-12 14:41:38 504

原创 对象和引用类型的赋值都是通过引用传递的方式进行的,这意味着变量实际上存储的是对象的引用,而不是对象本身的副本

这篇博客我主要想解释一下这句话:对象和引用类型的赋值都是通过引用传递的方式进行的,这意味着变量实际上存储的是对象的引用,而不是对象本身的副本。其实这段话早在学习JS的时候就接触过,只是被我丢进了“记忆垃圾桶”,但是昨天遇到的一个bug,让死去的回忆突然攻击我。

2024-06-12 11:02:41 647 1

原创 Vue3项目准备:utils工具插件文件夹中封装request.js配置axios请求基地址及超时时间、请求拦截器、响应拦截器

概念:访问权限的令牌,本质上是一串字符串创建:正确登录后,由后端签发并返回作用:判断是否有登录状态等,控制访问权限注意:前端只能判断token有无,而后端才能判断token的有效性通俗地讲,每个已经登录的用户都会有一个独一无二的token,这个token是用户访问除登录页之外的其他网页、向服务器发请求的一把“钥匙”,如果token为空(没有钥匙)或用户伪造了token(钥匙是假的)或者token已过期,那么就需要将用户“踢”回登录页,让用户登录之后再访问网页。

2024-06-06 21:38:00 688

原创 什么?!这年代还有人用父子组件通信?

因为本前端菜鸟写代码从没考虑过代码是否易于维护,所以一旦涉及组件通信,一律使用Pinia状态管理,至于父子组件通信啥的,学完Pinia之后就被我狠狠抛弃了,当时就在想:为什么不直接教Pinia,这玩意儿不是远比父子组件通信好用吗?但是这几天研读黑马程序员大事件的代码居然发现了父子组件通信,为了完全读懂代码,打算前来复习,重拾被我扔掉的知识。

2024-06-05 13:51:42 217

原创 Vue插槽的介绍及使用:默认插槽 / 后备内容 / 具名插槽 / 作用域插槽

在认识插槽前,我们先了解一下什么时候可以用插槽。

2024-06-05 11:46:30 298

原创 前端企业级代码到底是什么样的?

这篇博客就是想聊聊天,讲讲最近前端学习上发生的一些趣事,以及我的一些经验和感触

2024-06-04 15:48:54 308

原创 Pinia的介绍、使用、持久化、统一管理

Pinia 是 Vue 的最新 状态管理工具,状态就是数据。通俗地讲:Pinia 是一个插件,可以帮我们管理 vue 通用的数据 (多组件共享的数据)。比如一份数据有多个组件需要使用,在学Pinia之前我们需要用父子组件通信这样麻烦的方法,但是学习了Pinia之后,我们只需要把这些需要共享的数据扔进一个数据仓库,在需要使用这些共享数据的组件中导入这个数据仓库就可以了。

2024-06-03 21:00:50 409

原创 前端框架前置知识之Node.js:fs模块、path模块、http模块、端口号介绍

类似插件,封装了方法 / 属性。

2024-06-03 15:58:16 473

原创 前端框架前置知识之Node.js:Node.js入门

前端程序员有必要学 Node.js 吗?要学到什么程度?其实 node.js 并不属于前端,它是后端,只不过他是用 js 语法写的。如果你想前端转后端,那node.js是一个很好的跳板那为什么黑马程序员的前端学习路线图上,node.js 却是Vue 框架的前置知识呢?其实主要是想让大家了解一下前端工程化的知识,因为node.js 是前端工程化的基础。这有利于后续 Vue 框架的学习,而且可以让大家更深入地了解一些原理层面的知识,应该也会有利于后续的面试

2024-06-03 15:39:55 467

原创 CSS学习笔记:bootstrap的介绍、下载、使用及响应式布局的实现

Bootstrap 是由 Twitter 公司开发维护的前端 UI 框架,它提供了大量编写好的CSS 样式bootstrap过时了吗?其实在学bootstrap这一部分的网课时,在弹幕上看到一些同学说bootstrap已经过时了,这里谈谈我的看法

2024-05-30 15:01:09 1290 2

原创 CSS学习笔记:响应式布局的原理——媒体查询

在实际书写代码时,我们不会自己去手写媒体查询来实现响应式布局,我们一般会调用现成的代码库或使用现成的框架(但这些代码库或框架的底层原理是媒体查询,所以了解媒体查询也是很有必要的)当视口大小变化时,网页布局也随之变化以腾讯前端官网为例,当视口宽度逐渐缩小时,一行排列的盒子数量从4个减少到2个再减少到1个。

2024-05-29 15:10:41 513

原创 CSS学习笔记:vw、vh实现移动端适配

移动端即手机端,也称M端移动端适配:同一套移动端页面在不同屏幕尺寸的手机上可以实现宽度和高度的自适应,也就是页面中元素的宽度和高度可以根据屏幕尺寸的变化等比缩放但现在,企业中最常用的实现移动端适配的方案是vw、vh,而不是rem。

2024-05-29 11:07:57 437

原创 CSS学习笔记:Less

Less是一个CSS预处理器, Less文件后缀是.less扩充了CSS 语言,使CSS具备一定的逻辑性、计算能力可以通俗地理解:Less是一种更好用的CSS。

2024-05-28 16:25:01 460

原创 CSS学习笔记:rem实现移动端适配的原理——媒体查询

移动端即手机端,也称M端移动端适配:同一套移动端页面在不同屏幕尺寸的手机上可以实现宽度和高度的自适应,也就是页面中元素的宽度和高度可以根据屏幕尺寸的变化等比缩放rem配合媒体查询可实现移动端适配。

2024-05-28 09:32:45 442

原创 CSS学习笔记:flex布局(弹性布局)

父元素添加display: flex。

2024-05-27 16:45:45 637

原创 设置height:100%不生效的原因

之前网课案例总是不屑于去看,因为总觉得太花时间,但是不可否认的是,认真去看还是会有收获的,而且常有意外收获昨天在看实现动画效果的综合案例中,意外解决了我长久以来的一个疑问:为什么给元素设置height:100%不生效?

2024-05-22 10:58:50 493

原创 CSS学习笔记:动画——使用animation添加动画效果

例如transition: all 0.5s;-> 拥有该属性的标签,在样式改变时,将在设定的时间内逐渐过渡到另一个样式。

2024-05-21 15:50:51 532

原创 CSS精灵图

精灵图可以减少服务器被请求次数,从而减轻服务器压力,同时也可以提高页面加载速度,提升用户体验

2024-05-20 21:25:37 210

原创 CSS学习笔记:空间转换——使用transform属性实现元素在空间内的位移、旋转、缩放等效果

使用perspective属性实现透视效果什么是透视:近大远小,近实远虚说明:perspective的值指的是透视距离,透视距离也称为视距,所谓的视距就是人的眼睛到屏幕的距离。

2024-05-20 16:31:09 283

原创 uniapp微信小程序开发踩坑日记:由于图表数据渲染不出来,我第一次在项目中用watch函数监听数据变化

图表的数据不是响应式的。有时候后端数据还没返回,图表就已经渲染好了,那时候数据还是空。所以要用watch监听数据变化,等数据从空变为有值的时候再渲染图表

2024-04-28 20:35:12 787

原创 uniapp微信小程序开发踩坑日记:Vue3 + uniapp项目引入Echarts图表库

网上很多在微信小程序中导入Echart的教程,但很多都不兼容Vue3+uniapp构建的小程序项目,我经过查找资料加动手实践,整理出了一套成功的方案。

2024-04-26 17:07:05 1844 3

原创 第一次开发微信小程序的总结与心得

我们的小程序开发团队有三个人——两个前端和一个后端,一个没有产品经理和UI设计师的队伍,一个小程序开发零经验的队伍,却需要完成需求分析、页面设计、代码编写、功能测试、小程序上线的整个过程,所以在开发过程中,我们遇到了许多难题,踩了很多坑。

2024-03-28 15:06:53 845

原创 Vue3:网页项目中路由的设计和配置

为了避免我每次建项目配路由的时候都回去翻网课,打算整一博客。

2024-03-22 15:46:43 590

原创 Vue3项目中去除默认页边距(设置全局样式)

我想用一张背景图占满整个页面(代码如下),但是渲染出来的图片无论如何都和页面边缘有一个边距,图片无法真正占满整个屏幕我学着原生项目的开发思路,加入如下代码,但是边距还是存在,把 * 换成body,结果也是如此。

2024-03-21 16:07:59 933 1

原创 Vue3 + Vite创建项目并完成git管理、组件库导入、Axios安装、设置别名路径联想提示

由于每次创建项目、初始化配置时我都要回去翻各种网课,所以这次打算把这一套流程记录下来。

2024-03-21 11:41:41 1052

原创 CSS学习笔记:transform属性实现元素的位移、旋转、缩放

如果在一个选择器中出现多个transform属性,写在下面的会覆盖写在上面的,导致上面的属性不生效,所以需要写成符合属性!-> 拥有该属性的标签,在样式改变时,将在设定的时间内逐渐过渡到另一个样式。鼠标进入黑框,粉色方块在0.5秒内下移100px,鼠标离开黑框,粉色方块在0.5秒内上移100px。被添加旋转属性的元素,默认旋转轴是元素的中心轴,可通过transform-origin来改变旋转轴。旋转会改变网页元素的坐标轴向,所以在复合属性中,最后再写旋转!单位是deg,即“度”,一周是360deg。

2024-03-20 15:35:46 802

原创 uniapp微信小程序开发踩坑日记:获取用户头像并持久化存储到后端服务器

虽然e.detail.avatarUrl存储了用户的新头像,但是这只是微信的一个临时文件,如果直接将这段路径以字符串的形式存储到后端服务器,那下次获取到头像的时候可能该临时文件已经失效,导致头像无法正常渲染,所以我们需要在文件失效之前,将文件保存到后端服务器这就涉及到一个新的API:uni.uploadFile(OBJECT)

2024-03-13 20:46:59 2306

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?