自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(89)
  • 收藏
  • 关注

原创 CSS兄弟选择器:+与~的差异解析

CSS选择器对比:相邻兄弟(+)与通用兄弟(~) 相邻兄弟选择器(+)仅选择紧邻的下一个兄弟元素,要求元素紧密相连;而通用兄弟选择器(~)选择指定元素之后的所有兄弟元素,允许中间有其他元素间隔。相邻兄弟选择器适用于特定位置的样式控制,通用兄弟选择器则适合批量设置样式。示例代码通过不同背景色和边框直观展示了两种选择器的差异和应用场景。

2025-09-29 14:08:25 759

原创 UniApp键盘监听全攻略

UniApp键盘监听实现指南 本文介绍了在UniApp中监听键盘高度变化的完整解决方案,适用于聊天、评论等需要输入交互的场景。核心是通过@keyboardheightchange事件监听键盘状态变化,动态调整页面布局。关键点包括:必须设置adjust-position="false"禁用自动调整,使用flex布局实现页面结构,通过计算属性动态计算底部内边距,并添加防抖函数优化性能。代码提供了完整的模板、脚本和样式实现,兼容微信小程序、App等多平台,并包含过渡动画优化用户体验。

2025-09-28 10:10:51 785

原创 UniApp ConnectSocket连接websocket

useSocket WebSocket 封装 Hook 使用说明 该文档介绍了基于 Vue 3 Composition API 的 WebSocket 封装 Hook,专为 UniApp 项目设计。项目包含 Node.js 服务端和 UniApp 客户端两个仓库。 核心功能包括: 自动连接管理 自动重连机制 心跳检测 消息管理 状态监控 错误处理 文档提供了完整的安装指南、基本使用示例和 API 参考,包含连接配置、消息发送、状态监控等核心功能的实现代码,帮助开发者快速集成 WebSocket 实时通信功能

2025-09-25 11:18:39 1038

原创 Vue3中使用高德地图进行定位

文章摘要:本文介绍了高德地图组件的封装实现,基于@amap/amap-jsapi-loader库开发。主要内容包括:1) 使用示例展示组件在表单中的集成方式,支持双向绑定经纬度和地址;2) GDMap组件核心实现,包含地图容器、搜索框和位置提示功能;3) 关键功能如地图初始化、标记点管理、坐标转换等,通过AMap API实现地图交互和位置搜索。组件支持自定义宽高和禁用状态,适用于需要地图选点的业务场景。

2025-08-27 14:35:29 340

原创 axios无感刷新token

本文展示了一个前端Token管理方案,包含以下核心功能:1) 通过axios拦截器自动处理请求和响应;2) 实现Token获取、验证和刷新机制;3) 采用队列处理并发请求时的Token刷新问题。后端提供三个接口:获取初始Token、受保护资源访问和Token刷新,Token有效期为10秒。当Token过期时,前端会自动触发刷新流程,避免重复刷新请求,确保用户体验。该方案适用于需要身份验证的前后端分离应用,有效解决了Token过期和并发请求的问题。

2025-07-07 17:27:53 711

原创 Vue3封装动态Form表单

本文介绍了两种在Vue3中优化表单开发的方法:1)使用FormBuilder组件封装表单逻辑,通过props传递配置;2)结合hooks实现更灵活的渲染。主要特点包括: 通过componentMap映射UI组件,减少重复代码 支持动态隐藏字段(isHidden) 提供两种使用方式:组件直接引用和hooks渲染函数 内置表单验证功能 支持响应式布局配置(span) 核心代码展示了如何将表单配置抽离为fields数组,通过v-for动态渲染表单元素,实现了表单开发的模块化和可维护性提升。

2025-07-04 16:20:00 1178

原创 纯HTML中使用shadowRoot自定义组件

/ 创建影子 DOM(open 模式)/* 全局样式 */// 触发自定义事件。// 注册自定义元素。// 监听自定义事件。

2025-07-02 16:57:05 943

原创 js消除异步函数的传染性

摘要:消除异步函数的传染性 本文探讨了异步函数(async/await)的传染性问题及其解决方案。异步函数会破坏纯函数的特性,导致调用链上的函数都必须变为异步。通过重写fetch/axios请求方法并引入缓存机制,可以实现异步函数的"消除"。具体方法包括:1)保存原始方法;2)创建缓存状态管理系统;3)重写请求方法实现缓存逻辑;4)通过try-catch捕获Promise异常;5)最终恢复原始方法。这种技术在不污染纯函数的前提下,有效解决了异步传染性问题,适用于fetch和axios等多

2025-06-12 14:39:25 1226

原创 vue3+ts自定义表格组件

自定义excel数据展示表格

2025-01-23 15:39:54 513

原创 vue3+vite+ts中如何动态使用import.meta.env中的变量

不想在使用import.meta.env的时候,还去找到变量文件去看。这个时候在vue文件中使用的时候,就会有变量提示。

2024-11-11 16:15:57 701

原创 Vue2中使用firefox的pdfjs进行文件文件流预览

pdf链接或者pdf文件流的预览。

2024-11-06 11:45:04 1003

原创 uniapp h5端临时路径转file对象上传

uniapp h5页面临时路径转file对象上传到服务器

2024-11-05 18:08:47 1873 1

原创 windows中使用Jenkins打包,部署vue项目完整操作流程

在Jenkins已经安装的基础上,可以开始下面的教程。网上有许多安装教程,简单罗列几个。

2024-07-19 14:44:07 1199

原创 终止Promise的执行

promise的终止

2024-07-16 13:57:02 449

原创 TamperMonkey - 笔趣阁文字嵌入其他平台

【代码】TamperMonkey - 笔趣阁小说嵌入其他网站,快乐摸鱼。

2024-05-23 09:18:24 363

原创 tinymce上传图片或者其他文件等等

tinymce默认使用英文,如果需要中文化,需要去官网下载指定的zh_CN.js文件然后放到langs文件夹下面。为了方便我这边直接创建了一个vue文件,可以理解为vue组件,直接把源码放进去。需要注意的是tinymce不同版本的上传图片可能略微有些不同,请注意分辨。缺点: 需要申请特定apikey,类似于百度,高德地图;tips: tinymce在vue中常用的有两种方式。缺点: 需要自己手动的封装组件,灵活性高。优点: 不需要申请特定的apikey。预览,两种图片上传的方式有一些不同。

2024-02-29 14:25:02 2079 4

原创 图片调色盘

图片调色盘

2023-10-09 15:06:31 645 1

原创 Vue+Nodejs+Express+Minio 实现本地图片上传

默认账号密码minioadmin和minioadmin,点击9000端口的这个链接,即可访问客户端。nodejs连接Minio,简易服务进行图片上传,比较简单,直接上代码。安装完成之后,可以将minio配置成环境变量方便使用。都要下载可以自定义安装目录。配置了环境变量启动命令式。

2023-07-31 17:23:12 2708 2

原创 nodejs反向代理服务

【代码】nodejs反向代理服务。

2023-07-28 16:03:01 877

原创 vite中手写几个简易的插件demo

vite自定义插件

2023-07-07 17:04:18 885

原创 redux和react-redux结合书写计数器

实现UI组件和容器组件分离。

2023-05-24 14:29:30 179

原创 js 歌词滚动

歌词滚动

2023-03-24 15:51:57 595

原创 你不知道的 CSS 之包含块

css包含块

2023-03-23 17:54:19 459

原创 CSS 属性计算过程

css属性的计算过程

2023-03-23 17:43:36 610 2

原创 JavaScript中如何监听dom的节点变化

监听dom节点的变化

2023-03-23 14:10:05 696

原创 不同的html中,加载公共的文件

tips:例如有两个html文件,main.html,index.html,每个html文件都需要引入很多公共的资源文件,难道我需要多个复制吗>,不需要只需要如下操作。

2023-03-23 09:00:16 282

原创 canvas替换图片背景色

canvas替换图片背景色。

2023-03-21 17:59:04 2094

原创 web worker的基本使用案例

spak-md5.js由于代码太长,这边提供下载链接。大致的使用方法如上,如果想更详细的了解的话,请转至。代码按照顺序分别如下。

2023-03-10 17:29:10 846

原创 高德地图绘制矩形、多边形围栏获取坐标点

高德地图

2023-01-13 09:51:13 2796 2

原创 鼠标拖动改变盒子的大小

【代码】鼠标拖动改变盒子的大小。

2022-12-08 15:47:46 976

原创 百度地图划区测量获取坐标

百度地图面积测量

2022-11-23 09:43:32 512

原创 vue2和vue3的数据双向绑定小测试

【代码】vue2和vue3的数据双向绑定小测试。

2022-10-31 15:47:52 144

原创 自定义指令下拉菜单隐藏(点击外部指令隐藏)

自定义指令下拉菜单隐藏。

2022-09-07 17:57:21 758

原创 ant-design-vue使用指令的方式进行弹窗的拖拽

ant-design-vue使用指令的方式进行弹窗的拖拽。

2022-07-20 10:55:12 1438 2

转载 Vue-cli4.X项目中使用postcss-px2rem

Vue-cli3.X、Vue-cli4.X项目中使用px2rem

2022-06-18 18:47:38 662 3

原创 mysql简单的修改my.ini文件跳过输入密码进入mysql

找到mysql安装目录下面的my.ini文件然后打开笔记本进行,找到[mysql] 在下面添加上用户名和密码然后保存修改即可,无须关闭mysql服务

2022-04-16 17:20:10 1792

原创 仿京东的商城图片放大功能

1.源代码<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> &l

2022-04-07 09:19:21 292

原创 JavaScript中关于数字计算精度丢失问题的处理

/** * @description 适用加法和减法,如果是加法就传正数,如果是减法就传负值 * @return {*} 返回值 * @param { Number } n1 数字1 * @param { Number } n2 数字2 */export function addAndSubtract(n1, n2) { let r1, r2, m try { r1 = n1.toString().split('.')[1].length } catch (e) {

2022-03-07 14:21:35 684

原创 使用原生table 书写复杂人事档案表格

<template> <div style="margin: 0 auto"> <table> <tr> <td colspan="24" style="font-size: 24px;font-weight: bold"> 人事档案 </td> </tr> <tr> <td colspan=

2022-03-03 11:06:13 471

原创 vue使用vue-amap 高德地图进行选点和搜索

vue使用vue-amap进行地图点的搜索和点击选点npm install vue-amap --save //下载npm 包在main.js主文件中进行引用import VueAMap from "vue-amap";Vue.use(VueAMap);VueAMap.initAMapApiLoader({ key: "XXXXXXXXXXXXXXXXXX",//高德开放平台申请的key值 plugin: [ "AMap.Autocomplete", //输入提示插.

2022-01-17 09:00:51 5980 10

空空如也

空空如也

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

TA关注的人

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