- 博客(29)
- 收藏
- 关注
RSS订阅原创 前端监测窗口尺寸和元素尺寸变化的方法
window.resize事件是浏览器提供的一种事件，用于监听窗口大小的改变。这意味着当用户调整浏览器窗口大小时，相关的JavaScript代码将被触发执行。这为开发者提供了一种机制，可以在不同屏幕尺寸下优化网页布局和样式。示例假设你有一个 元素，你希望在窗口大小变化时调整它的宽度和高度防抖处理resizeObserverResizeObserver 是一个现代的浏览器 API，用于监听 DOM 元素的大小变化。与传统的 window.resize 事件不同，ResizeObserver 可以
2025-03-12 16:19:36
554
原创 CSS渐变背景色
重复渐变可以创建重复的渐变效果，适用于线性渐变和径向渐变。为了确保在不同浏览器中的兼容性，可以使用浏览器前缀。径向渐变从中心点向外辐射状进行颜色过渡。圆锥渐变围绕一个中心点旋转进行颜色过渡。线性渐变沿着一条直线方向进行颜色过渡。可以将渐变与其他背景属性（如图片）组合使用。颜色值来创建带有透明度的渐变。
2025-02-19 21:40:47
3069
原创 flex布局与grid布局简析
flex布局又称之为弹性布局；主要用于在一维上盒子的布局排列；设置 或 的元素，即为容器；作为 Flexbox 布局的父容器，控制其内部子元素的排列方式。Flex 容器内的直接子元素，即为项目；每个子元素都是一个 Flex 项目，可以通过 Flexbox 属性控制其行为。Flex 容器的主要方向，由 属性决定。与主轴垂直的轴。控制项目在垂直于主轴方向上的对齐方式。2. 作用：定义项目的放大比例，分配剩余空间。取值：数值（默认值为 ），表示不放大。如果所有项目的 都为 ，则剩余空间将等分
2025-02-19 10:07:13
799
原创 编程规范-代码检测-格式化-规范化提交
编程格式规范的问题代码格式规范git提交规范对于代码格式规范而言，通过ESLintPrettierVSCode 配置配合进行了处理。最终达到了在保存代码时，自动规范化代码格式的目的。git对于 git提交规范而言使用了husky来监测Git hooks约定式提交规范commitizen：git 提交规范化工具commitlint：用于检查提交信息pre-commitgit hooks钩子：只检查本次修改更新的代码，并在出现错误的时候，自动修复并且推送监测Git hooks约定式提交规范。
2024-06-07 10:31:23
855
原创 Vue单文件组件（SFC）规范
vue文件是一个自定义的文件类型，用类 HTML 语法描述一个 Vue 组件。每个.vue文件包含三种类型的顶级语言块<template><script>和<style>，还允许添加可选的自定义块：data() {return {data() {return {data() {return {data() {return {</data() {return {</data() {return {data() {return {exportdata() {
2024-02-28 15:47:10
995
原创 cmd常用命令
可删除字符数量,同于F2的功能 （例： 输入 cd test 将光标移动到d下面，按下F4 输入e后,系统自动删除t以后(包括d) e(不包括e)以前的字符 命令变为 cest）可复制字符数量 , 输入上次命令中含有的字符,系统自动删除此字符后的内容. （例：输入 cd test ，按下F2 输入 e 后,系统自动输入 cd t 命令）单字符输出上次输入的命令，如果已经是最后的一条的命令，则不进行任何切换操作。F7中选择的命令是有编号的，按下F9再输入命令的编号，就能快速执行命令。
2024-02-03 16:38:35
1414
1
原创 电脑快捷键
切换窗口(仅同一软件内多个窗口有效，如浏览器开了许多个网页)在一个文本或者网页里面查找，相当实用（退出一般按ESC）打开任务管理器（或者ctrl+alt+delete）选中窗口但不打开，使用回车打开。选中所有文本,或所有文件。
2024-02-03 16:35:31
182
原创 vue项目实现生成一个简单二维码
最后，如果上面的流程都能走通，那么，就可以按照自己项目的时机需求去再做开发了，至少生成二维码的功能已经实现了。vue项目中实现的 一个简单的二维码生成例子。然后尝试走通下面的业务。
2023-11-27 15:30:46
794
原创 Echarts设置环形图中心文字
通过这种方式确实可以达到效果，但是，label的主要目的是用来配置环形图提示信息的，而不是用来配置环形图中心文字的，而且如果使用这种方式，那么，环形图中心文字和环形图各部分的提示信息是不能同时存在的，如果强行把label写成数组形式，把提示信息加上去，那么，提示信息就会和中心文字一起在环形图中心层叠显示。但是，如果环形图位置不是居中的，也就是相比于默认值而言发生了偏移，那么，graphic中也需要手动的进行配置才行；那么，使用该定位其位置也设置为center，中心文字和环形图都居中，效果很好。
2023-11-21 10:56:41
16489
原创 在原生HTML页面发起axios请求
在原生html页面发起axios请求，首先需要先引入axios文件包，然后按照axios的请求方式发起请求即可，但如果页面在本地，那么请求一般会报错跨域问题，需要部署一下才能正确请求数据；
2023-11-16 11:23:25
4497
原创 JS计算中出现无限小数位的情况
在计算机角度，计算机算的是二进制，而不是十进制。二进制后变成了无线不循环的数，而计算机可支持浮点数的小数部分可支持到52位，所有两者相加，在转换成十进制，得到的数就不准确了，加减乘除运算原理一样。数转换为百分数的问题，用浮点数乘以100结果产生了一堆小数位。查资料发现原因是由于计算机计算会先把数字转换成二进制计算，然后在转换为10进制，导致精度丢失。
2023-11-02 15:10:54
1389
原创 vue项目中使用特殊字体的步骤
然后把该文件放到src -> assets -> fonts -> 目录下，并在当前目录里新建一个fonts.css文件，把字体文件在该文件中声明。在项目中使用特殊字体，需要注意，所使用的特殊字体是否被允许商用或是个人开发，以及如何使用，切记不要侵权。首先需要在对应字体网站下载字体文件，取出里面后缀名为.ttf的文件。再然后就在main.js文件中全局声明fonts.js文件。最后在需要使用特殊字体的地方直接引用即可。
2023-09-14 18:02:41
566
原创 vue项目中跳转到新页面的方式
是一个用于获取当前页面 URL 或让浏览器跳转到新 URL 的重要方法，是 window.location 对象的属性。同时，当通过将 URL 指定给 window.location.href 时，可以让浏览器跳转到新的 URL。，唯一不同的是，它在导航时不会向 history 添加新记录，正如它的名字所暗示的那样——它取代了当前的条目。点击按钮后，先通过接口获取到要跳转的URL地址，然后再进行跳转，该跳转是从一个系统的A端跳转到B端。open() 方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。
2023-07-13 21:40:11
15860
1
原创 解决Echarts官网打开慢的问题
正常情况下，在Windows环境中打开ECharts官网可能会遇到非常缓慢的情况，一直处于加载中，甚至打不开，那么做一些处理即可大大缓解这个问题。host文件地址：C:\Windows\System32\drivers\etc。挖个坑：2023.7.12 该配置仍可用。但不保证永久可用，后续再更！解决在Windows系统中打开ECharts官网缓慢的问题。打开hosts文件，在文件最后追加上如下设置，然后保存即可。在测试就会发现：秒开。
2023-07-12 11:15:14
6528
7
原创 前端优化-首屏加载优化
TinyPNG 是一款线上图片压缩工具，采用智慧型无损压缩技术来降低 PNG 图片大小，而这个方法可以透过降低图片中的色彩数量，来减少存储图片所需的空间，这样做法能够大幅度降低图片的大小，但又不会造成图片过度损坏，像素降低等等，至少从肉眼上看不出差别，且能够保存 PNG 的 alpha 透明度特性。app.js中的页面拆分成单独的js文件，按需加载，加速app.js文件的下载速度从而减少首页加载时间。无需上传服务器，本地压缩，无大小，数量限制，支持JPG、PNG压缩，PNG支持良好，可自定义压缩参数。
2023-07-10 17:25:08
3508
原创 VsCode快捷键
ctrl+alt+f ：多行代码快速对齐ctrl+h：调出文字替换弹窗ctrl+c：复制选中的文本或鼠标当前所在行的文本内容ctrl+x：裁切选中的文本或鼠标当前所在行的文本内容ctrl+v：粘贴剪切板复制或裁切的内容到指定位置ctrl+f：调出搜索框ctrl+a：全选ctrl+z：撤销上一步操作，在当前基础回到上一步ctrl+y：还原上一步操作，在当前基础上推进到下一步按住Alt+鼠标：实现定位多个鼠标点位，常用于修改多个值，或在很多地方修改数据或增加数据
2023-07-05 23:20:39
334
原创 vue中this.$router.push()路由传值
部门列表页首先需要拿到包裹在路由中传过来的数据，对于本范例而言，就是需要拿到数据中的公司编号，然后在created() 生命周期函数中调用对应方法中的接口，把公司编号作为参数传给后端，然后后端根据公司编号在数据库表中去查询数据，最后把数据打包返回给前端，前端的部门列表页接收数据之后，再把数据展示到公司的部门列表页中。先来描述一下这东西能干什么？而接口文件，则是为了保证，跳转到指定页面后数据的正常显示，一般情况下，这种自身带有参数的跳转，目标页面会接受其所传的参数，然后打包传给后端去查询数据，最后把。
2023-06-29 23:23:19
19206
1
原创 特殊字体的使用步骤
一个专门收集整理「免费商用字体」的网站，网站简单粗暴地列出了多款免费商用字体的预览和下载链接，看到喜欢的字体就能直接下载。是阿里巴巴旗下的矢量图标库网站，这个网站的「字体库」页面提供了 8 款免费可商用字体，其中有 2 款出自阿里巴巴团队——站酷网，是国内最大的设计社区，聚集了许多优秀的设计师，在这里可以看到他人上传的设计作品、设计经验分享和教程等。Pixso是一款专注于UI设计领域，支持多人协同的国产在线设计软件，主要用于UI设计。在站酷的「站酷字库」页面，你可以免费下载 7 款站酷冠名的字体，如。
2023-06-23 17:36:47
506
1
原创 vue-element-admin项目安装依赖报错解决方案
路由文件中的位置： src/router/modules/components.js 搜索markdown，把相应路由代码删除或注释。1、打开package.json配置文件，把 " tui-editor：‘xxxx’ " 这行配置删除。components位置： src/components/MarkdownEditor，直接删除该组件即可。而简洁版： vue-element-template 拉取之后，直接。，依旧报错，始终无法安装项目依赖。删除一部分代码，然后再安装依赖。
2023-06-22 14:07:49
3419
8
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人