- 博客(89)
- 收藏
- 关注
RSS订阅原创 前端监测窗口尺寸和元素尺寸变化的方法
window.resize事件是浏览器提供的一种事件，用于监听窗口大小的改变。这意味着当用户调整浏览器窗口大小时，相关的JavaScript代码将被触发执行。这为开发者提供了一种机制，可以在不同屏幕尺寸下优化网页布局和样式。示例假设你有一个 元素，你希望在窗口大小变化时调整它的宽度和高度防抖处理resizeObserverResizeObserver 是一个现代的浏览器 API，用于监听 DOM 元素的大小变化。与传统的 window.resize 事件不同，ResizeObserver 可以
2025-03-12 16:19:36
509
原创 CSS渐变背景色
重复渐变可以创建重复的渐变效果，适用于线性渐变和径向渐变。为了确保在不同浏览器中的兼容性，可以使用浏览器前缀。径向渐变从中心点向外辐射状进行颜色过渡。圆锥渐变围绕一个中心点旋转进行颜色过渡。线性渐变沿着一条直线方向进行颜色过渡。可以将渐变与其他背景属性（如图片）组合使用。颜色值来创建带有透明度的渐变。
2025-02-19 21:40:47
2541
原创 flex布局与grid布局简析
flex布局又称之为弹性布局；主要用于在一维上盒子的布局排列；设置 或 的元素，即为容器；作为 Flexbox 布局的父容器，控制其内部子元素的排列方式。Flex 容器内的直接子元素，即为项目；每个子元素都是一个 Flex 项目，可以通过 Flexbox 属性控制其行为。Flex 容器的主要方向，由 属性决定。与主轴垂直的轴。控制项目在垂直于主轴方向上的对齐方式。2. 作用：定义项目的放大比例，分配剩余空间。取值：数值（默认值为 ），表示不放大。如果所有项目的 都为 ，则剩余空间将等分
2025-02-19 10:07:13
745
原创 去除账号密码自动赋值时的输入框背景色
前端使用账号密码登录，若在网页保存过当前页面的密码和账号，那么当再次进入该页面，网页会自动的把账号和密码赋到输入框中，而此时输入框是带有背景色的，与周边的白色背景显得很不协调；因此想让其被赋值后背景色依旧是白色。css部分：需要使用deep样式穿透以及使用important提高到最高优先级（但一般情况下不建议使用important）html部分：给el-input加一个css类名，更便于直接选中输入框更改样式。
2024-12-06 10:32:29
348
原创 编程规范-代码检测-格式化-规范化提交
编程格式规范的问题代码格式规范git提交规范对于代码格式规范而言，通过ESLintPrettierVSCode 配置配合进行了处理。最终达到了在保存代码时，自动规范化代码格式的目的。git对于 git提交规范而言使用了husky来监测Git hooks约定式提交规范commitizen：git 提交规范化工具commitlint：用于检查提交信息pre-commitgit hooks钩子：只检查本次修改更新的代码，并在出现错误的时候，自动修复并且推送监测Git hooks约定式提交规范。
2024-06-07 10:31:23
841
原创 JS本地存储
2、Json 对象所存储的值 可以是： 数字（整数或浮点数）、字符串（在双引号中）、逻辑值（true 或 false）、数组（在中括号中）、对象（在大括号中）、null。2：储存大小–cookie一般储存不超过4KB数据，localStorage和sessionStorage一般储存不超过5MB数据（看浏览器机制）；localStorage用于储存不超过5MB的文本数据，持久化的本地存储，除非主动删除数据，否则数据是永不过期；sessionStorage用于储存不超过5MB的文本数据，页面（会话）关闭，
2024-06-03 15:58:26
606
原创 电脑桌面文件夹背景色变为黑色
找到有黑色背景的文件夹，右键点击并选择“属性”选项。在属性窗口中，切换到“自定义”选项卡。点击“更改图标”按钮。在图标选择窗口中，点击“还原默认值”按钮。点击“确定”以保存更改。
2024-05-20 21:56:12
2374
原创 前端传参的三种方式
对于这个接口而言，query是接口被调用时接收参数的形参，params即是传参方式，而query就是参数，其会自动拼接在请求地址的 url 后面，以问号分隔；这样我们可以直接在地址栏中看到请求的参数。但是在控制台中可以打印出来（这里不仅可以暂时data中的请求参数，也可以展示params中的请求参数）params的参数会拼接在地址栏中，而data中的数据会拼接在请求体中，可以在控制台看到二者。使用 data 传参，其会把数据拼接在请求体里 (body参数)在本接口中 query 中就是查询参数。
2024-05-20 15:53:54
2020
原创 vue登录页获取随机验证码
首先验证码随机图片组件；放在适当的文件中，后面引入到主页面。vue2的写法，vue3项目改写成ts写法即可。主页面，也就是登录页，在这里引入组件。根据需求再更改代码即可。
2024-03-31 16:12:16
599
原创 如何增加自己博客曝光率&粉丝量
首先，就是增加自己博客文章的曝光量，需要借助百度，谷歌等大型搜索引擎的力量让更多的人能够搜索到自己的博客文章；登录百度的资源搜索平台，提交你的文章链接，加快你的网站内容抓取和曝光率。有了曝光量之后，就会有更多的用户阅读到你的文章，增加的是阅读量，而不是粉丝，如何让来到的人阅读文章时变成你的粉丝呢？，那么别人点进你文章想阅读全文的时候，就得点击 关注博主阅读全文 的按钮，才能阅读全篇；想让自己的博客文章被更多人阅读，增加博客粉丝量，除了自己文章内容质量过关之外，还有一些可以使用的技巧；
2024-02-28 17:36:20
806
1
原创 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
979
原创 css实现上下左右居中
首先把内部盒子的位置设置为顶部和左侧距离大盒子顶部和左侧都是大盒子高度和宽度的50%；然后再把小盒子的顶部和左侧的位置都回退内部小盒子高度和宽度的50%；这样就刚好实现小盒子上下左右都居中在大盒子内部。利用display: flex和margin: auto实现。利用子绝父相和css3的transform属性实现。利用子绝父相和margin:auto实现。利用flex布局实现（弹性盒子）利用grid布局实现（网格布局）几种常用的上下左右居中方式。
2024-02-27 16:25:30
625
原创 修改element-UI组件样式
form表单禁用后背景色仍用白色，字体灰黑色；这里指的是输入框，文本域，下拉选择框等表单基础元素的背景色；也就是 placeholder 的提示信息的颜色；也就是输入框为空白时，其内部的提示文字的样式。这里单选框指的是横向的单选，两个圆圈二选一的那种。
2024-02-21 15:44:03
725
原创 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
1377
1
原创 电脑快捷键
切换窗口(仅同一软件内多个窗口有效，如浏览器开了许多个网页)在一个文本或者网页里面查找，相当实用（退出一般按ESC）打开任务管理器（或者ctrl+alt+delete）选中窗口但不打开，使用回车打开。选中所有文本,或所有文件。
2024-02-03 16:35:31
179
原创 element-ui表单回显后只能编辑一次的问题
问题描述：element-ui表单，编辑回显后，只能编辑一次，紧接着第二次打开编辑便无法修改表单的中的内容。在表单的回显处，加上这行代码即可。
2024-01-02 15:32:34
667
原创 vue项目实现生成一个简单二维码
最后，如果上面的流程都能走通，那么，就可以按照自己项目的时机需求去再做开发了，至少生成二维码的功能已经实现了。vue项目中实现的 一个简单的二维码生成例子。然后尝试走通下面的业务。
2023-11-27 15:30:46
792
原创 Echarts设置环形图中心文字
通过这种方式确实可以达到效果，但是，label的主要目的是用来配置环形图提示信息的，而不是用来配置环形图中心文字的，而且如果使用这种方式，那么，环形图中心文字和环形图各部分的提示信息是不能同时存在的，如果强行把label写成数组形式，把提示信息加上去，那么，提示信息就会和中心文字一起在环形图中心层叠显示。但是，如果环形图位置不是居中的，也就是相比于默认值而言发生了偏移，那么，graphic中也需要手动的进行配置才行；那么，使用该定位其位置也设置为center，中心文字和环形图都居中，效果很好。
2023-11-21 10:56:41
16093
原创 elementUI-表单-校验
model=“form” 必须配置 表单数据对象 form 指的是该表单对应的data中的表单，而 el-form-item 绑定的数据大多都在这个form中。通常有时候还需要在该函数里做一些其他操作，因为resetFields有时候并不能保证可以清空form表单中的数据，那么就需要额外的对form表单数据进行清空。若有多条校验规则且有的字段就不止一个校验规则，则使用对象数组；清除表单校验，一般用于表单的取消编辑和关闭表单时使用，避免下次打开表单时校验规则残留在表单上。
2023-11-20 09:22:28
1035
原创 elementUI使不可编辑输入框恢复白色背景色
当给elementUI输入框组件加上 disabled 属性之后输入框就会呈现灰色，影响用户体验。只需要在css中加上下面这段代码即可。
2023-11-18 10:30:02
532
原创 在原生HTML页面发起axios请求
在原生html页面发起axios请求，首先需要先引入axios文件包，然后按照axios的请求方式发起请求即可，但如果页面在本地，那么请求一般会报错跨域问题，需要部署一下才能正确请求数据；
2023-11-16 11:23:25
4441
原创 vue解决跨域问题
当然，还存在一种情况就是，在外网跨域没有问题，随便跨域，而如果把前后端项目都部署到内网去，就完了，怎么配置都不行，始终爆跨域问题，嗯~~，思索良久未找到解决方案，最终把前端项目打包放到后端项目中，不再分别部署，齐活。好，好，好，这样玩是吧！如果都配置完成之后，但是仍旧不生效，就像是项目压根没走proxp一样，那么就是项目中已经配置过baseURL了，找到并注释掉再试试，一般会在request.js文件中。同源策略不是服务器行为，而是浏览器的行为，服务器会正常响应请求，但是如果不同源会被浏览器拦截。
2023-11-15 09:58:31
237
原创 JS计算中出现无限小数位的情况
在计算机角度，计算机算的是二进制，而不是十进制。二进制后变成了无线不循环的数，而计算机可支持浮点数的小数部分可支持到52位，所有两者相加，在转换成十进制，得到的数就不准确了，加减乘除运算原理一样。数转换为百分数的问题，用浮点数乘以100结果产生了一堆小数位。查资料发现原因是由于计算机计算会先把数字转换成二进制计算，然后在转换为10进制，导致精度丢失。
2023-11-02 15:10:54
1366
原创 css为盒子设置滚动条&隐藏滚动条
此外，还可以使用“auto”属性值。当内容超出盒子边界时，会出现竖直方向的滚动条。如果内容未超出盒子边界，则不会出现滚动条。如果内容同样超出了盒子的水平范围，那么还会出现一个水平方向的滚动条。然后，给盒子加入overflow属性，该属性控制了当内容超出盒子边界时发生的事情。我们需要添加的是滚动条，因此设置为“scroll”。注意，如果内容没有超过盒子边缘，滚动条是不会出现的。首先，要为需要添加滚动条的盒子设置固定的高度和宽度，这样才能让内容超过盒子的边缘。：为盒子设置宽高，设置滚动条方向，隐藏滚动条。
2023-10-27 16:35:05
2707
原创 vue项目中使用特殊字体的步骤
然后把该文件放到src -> assets -> fonts -> 目录下，并在当前目录里新建一个fonts.css文件，把字体文件在该文件中声明。在项目中使用特殊字体，需要注意，所使用的特殊字体是否被允许商用或是个人开发，以及如何使用，切记不要侵权。首先需要在对应字体网站下载字体文件，取出里面后缀名为.ttf的文件。再然后就在main.js文件中全局声明fonts.js文件。最后在需要使用特殊字体的地方直接引用即可。
2023-09-14 18:02:41
555
原创 EL-UI树形表格页面首次加载-默认收起
属性确是是可以收起树形表格的，但是它起作用的时机为表格初始化时。但是在实际开发过程中表格的数据获取是异步的，也就是说，在数据来到表格之前，这个属性已经走完了它的流程，而当数据来到之后，就不在生效；即：只有初始化的时候是生效的，动态修改无效的。每修改一次就让表格初始化一下表格中的配置：控制展开/折叠，：用来二次初始化表格
2023-09-09 11:04:01
1252
原创 vue中属性执行顺序
综上，选项的执行顺序是 props -> data -> computed -> watch -> created -> mounted -> methods。至于methods，它们只是普通的JavaScript函数，可以在组件的任何地方定义。方法不遵循任何特定的执行顺序。至于props和watch，它们不是生命周期函数，而是特殊的属性。props是父组件传递给子组件的属性，而watch用于观察和响应数据的变化。同时，props和watch可以在任何阶段使用，而methods可以在任何阶段定义和使用。
2023-09-06 11:46:31
1191
原创 vue项目首次加载完页面后点击某个按钮出现页面强制自刷新
在form表单中使用button按钮导致form表单进行了页面刷新。button默认的“type=‘submit’”，点击会导致整个页面重新加载。所开发的vue项目每次跑起来之后就会出现点击按钮后重新加载整个页面的问题，但是只会在第一次点击的时候出现，后面就不会在出现加载整个页面的情况。采用框架自带的组件如“el-button”或者单独设置type属性如“type=‘button’”。
2023-08-30 14:49:31
1290
2
原创 elementUI弹窗关闭自动清空表单以及校验规则及不生效处理办法
element组件中的Dialog 对话框，有时候会出现，第一次打开的时候校验没有问题，但是如果紧接着第二次打开弹框的时候，上一次的校验就会残留在本次打开的弹窗上。点击叉号那么就需要在叉号的回调函数中去清空本次的校验记录，而取消按钮更好做，直接写个函数指明取消即可。弹窗关闭一共就两种方式，第一种点击叉号，第二种点击取消按钮，那么就需要在这两个节骨眼上做文章；对于叉号而言，添加close事件，函数同取消按钮。
2023-08-30 14:49:00
3012
原创 elementUI表格多选实现方式
是因为当数据量比较多的时候，数据会进行分页展示，例如有30条数据，每页在初始化时展示10条，第二页甚至第三页数据其实是没有获取的，该策略被称之为是懒加载，可以大大缩短求情时间，提升用户体验。那么，如何获取选中的数据呢，官方文档提供了三种钩子函数，但是一个就可以满足需求了，在表格设置中加上selection-change 这个事件，其功能为：只要选中的数据发生改变，那么就会触发这个函数。之前所做的工作，仅仅只能在当前页进行选中，获取选中的数据，而不能实现换页一起选中，点击下一页之后，之前选中的数据就丢失了。
2023-08-19 17:23:24
3546
原创 树形组件浅知
不过需要注意树形数据的写法，分支结点和叶结点写法不同，对照文档来看。如果使用npm 不行 那么就使用。最后就是对照文档改为自己想要的样式了。别人写好的轮子，会用即可。然后在使用的地方引入即可。首先，需要安装依赖，
2023-08-19 08:25:49
322
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人