同域名、同项目、仅 hash 变化,window.location.href 不跳转
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
两个 URL 只有 hash 后面的内容不同,浏览器会认为没有真正跳转,所以 window.location.href 不执行刷新
https://域名/cash-center/#/payMethod?params=abc
https://域名/cash-center/#/bindCard?params=12345
原因:浏览器只看 # 号前面的网址,不看 # 号 ...
多租户系统框架的界面分析设计
在一个多租户系统下,包含有平台超级管理员、以及租户管理员,其他自定义租户角色等不同的角色身份,我们根据它们不同的身份,让他们各司其职,在系统中构建不同的数据维护、防护层级,从而能够让整个系统有效的运作起来,而不会造成破坏。
1、系统角色的用例分析
我们根据不同的角色身份来绘制它们的用例,对我们理解整个 ...
Three.js实现更真实的3D地球🌍动态昼夜交替
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
这一切始于一个偶然的发现。前几天笔者在应用商店闲逛时,被一款3D动态壁纸深深吸引——那颗在手机屏幕上缓缓旋转的地球,光影随着时间自然流转,从阳光灿烂的白昼到星光点点的黑夜,过渡得如此丝滑而真实。那一刻,我被这种将宇宙微观化的美感震撼了。
作为一名前端开发 ...
微信H5 页面定位权限处理
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
适用场景:微信浏览器打开的 H5 页面,使用 common-bridge 调用定位。
现象: h5 通过微信打开,无论是ios还是安卓首次会弹出定位功能的授权,若用户选择不授权,定位授权的弹窗就后续没办法再弹出。
看了官方社区目前也没有给出解决方案
解决方案:如果用户 ...
用 Intersection Observer 打造丝滑的级联滚动动画
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
无需任何动画库,仅用原生 Web API 实现滚动时丝滑的淡入滑入效果,兼顾性能与体验。
你是否见过这样的交互动效:
用户滚动页面时,一组卡片像被“唤醒”一样,依次从下方滑入并淡入;
如果这些元素在页面加载时已在视口内,它们也会自动按顺序浮现。
这种效 ...
vxe-table 自定义数字行主键,解决默认字符串主键与后端类型不匹配问题
vxe-table 自定义数字行主键,解决默认字符串主键与后端类型不匹配问题
在使用 vxe-table 表格组件时,组件默认自动生成的行主键为字符串类型,但后端接口通常要求主键为数值(number)类型,直接提交会因数据类型不匹配导致接口报错。
有两种最优解决方案,支持局部配置和全局统一配置,彻底解决类型不兼容问题。
核心解决 ...
backstage~openapi的接入与protobuf的对比
swagger外部文档
apiVersion: backstage.io/v1alpha1
kind: API
metadata:
name: petstore
description: The Petstore API
spec:
type: openapi
lifecycle: production
owner: petstore@example.com
definition:
$text: https://petstore.swagger.io/v2/swagger.json
嵌入openapi文档
apiVersion: backsta ...
uni.request 二次封装分享
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
基于uni.request api进行二次封装
核心功能
响应内容格式和请求参数格式类型定义
请求拦截器与响应拦截器配置
设置请求头和params参数处理
加载提示与自定义提示文本
错误统一处理
接口缓存
取消请求功能
失败自动重试机制
并发请求控制
核心代码
// 响应内容 ...
前端 PDF 导出:从文件流下载到自动分页
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
在工作中,我们经常会遇到需要生成 PDF 的业务,比如合同、报告等。
前后端合作
对于前端来说,最省事的就是后端生成 PDF 文件,前端根据返回的 URL 地址进行下载。
URL 下载
如果后端直接返回一个可访问的 URL 地址,我们可以通过以下几种方式进行下载:
1. 使用 window.o ...
backstage~开始一个backstage应用
应该如何创建自己公司的backstage平台
1. 两种方式的本质区别
特性
npx @backstage/create-app
从 GitHub 下载源代码
产出物
一个完整的、可立即运行和开发的 Backstage 应用。
Backstage 项目框架本身的源代码,不是你应用的代码。
目的
创建你自己的、个性化的 Backstage 开发者门户。 这是官方推荐的、标准的启 ...
JS-前端埋点神器 navigator.sendBeacon 全指南
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
前言
在前端开发中,埋点系统是必不可少的一环。我们经常需要在用户关闭页面、刷新或跳转路由时,向服务器发送最后一条统计数据(比如用户停留时长、页面跳出率)。
但这看似简单的需求,在实现时却危机四伏:请求发不出去?页面跳转卡顿?今天我们就来聊聊这个问题的终极解 ...
AI 驱动!一款开源可自部署的个人卡片式笔记工具!
大家好,我是 Java陈序员。
在日常工作中,常常需要记录工作上的事项、学习笔记、突然的灵感等。但市面上多数笔记工具,要么是云端存储,要么功能臃肿,有的不适配技术笔记的排版需求,而且大部分无法自定义,满足不了个性化使用场景。
今天,给大家介绍一款开源的个人卡片式笔记工具,不仅支持私有化部署,而且集成 AI 功 ...
Vue<前端页面版本检测>
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
为什么需要版本检测
1. 解决浏览器缓存问题
静态资源缓存:浏览器会缓存 JS、CSS 等静态资源,用户可能继续使用旧版本
用户体验影响:用户无法及时获取新功能,导致功能缺失或操作异常
2. 保障功能一致性
功能同步:确保所有用户都能使用最新的功能和修复
数据一致性:避 ...
快速构建!一款兼具设计美学与高效开发的后台系统模版!
大家好,我是 Java陈序员。
做后台管理系统,最怕什么?怕从零搭框架、配路由、写表格、调样式...一周过去,真正的业务代码一行没写。更怕界面简陋、交互生硬,客户看了直摇头。
今天,给大家介绍一款开源的后台系统模板,兼具设计美学与高效开发!
关注微信公众号:【Java陈序员】,获取开源项目分享、AI副业分享、超200 ...
为什么禁止我请求别的网站的接口?——跨域与CORS
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
你有没有遇到过这种情况:在自己的网页上想请求别人的API,结果浏览器直接报错:Access-Control-Allow-Origin' header is missing。为什么浏览器要阻止你?服务器不响应不就完了吗?
今天,用小区门禁的故事,来讲讲 跨域 与 CORS。
什么是"跨域"?
同源策略 — ...
老板:能不能别手动复制路由了?我:写个脚本自动扫描
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
起因
周五快下班,老板过来看权限配置页面。
"这个每次都要手动输路径?"
"对,现在是这样。"我打开给他看:
角色:运营专员
路由路径:[手动输入] /user/list
组件路径:[手动输入] @/views/user/List.vue
"上次运营配错了,/user/list 写成 /user/lists,页面打不开找了 ...
vue3这些常见指令你封装了吗
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
vue3这些常见指令你封装了吗
👉指令搭建
vue3之中会有一些常见的指令操作,接下来我们就写一下,之前我们写了权限按钮,其实是类似的
指令的最主要文件如下,我们主要是主模块之中使用,其他的模块之中分割写好方法即可
指令主要文件
src%utils\directive\index.ts
import typ ...
React 技术深度探讨
聊React之前,先说个事实:它不是最年轻的框架,也不是概念最创新的那个。但它赢了。
赢在生态,赢在社区,赢在"一旦用顺了就很难换"的惯性。本文不吹不黑,客观聊聊React的核心逻辑、实际现状,以及值不值得继续押注。
一、核心概念:理解React的设计哲学
Virtual DOM:快是表象,稳才是本质
Virtual DOM(虚拟DOM)被谈烂 ...
前端大屏适配方案:rem、vw/vh、scale 到底选哪个?
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
上周帮朋友救火一个数据大屏项目,甲方临时说要从 1920×1080 的投影换成 3840×1080 的超宽拼接屏。朋友用的是 transform: scale 方案,结果两边各留了一大片黑边,甲方当场黑脸。
这事儿让我决定把大屏适配这个"老生常谈但总有人踩坑"的话题彻底讲清楚。
先说结论
我的推 ...
前端实现进度条
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
后端处理数据处理逻辑特别多的时候,并不会很及时返回数据,一般情况后端给前端返回进度,这个目前是前端自己返回进度到90,等到接口返回完成再到100%
1、设置全局样式
<div class="loading-overlay" v-show="PageController.nextLoading">
<div class="loading-con ...