自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

guochiscoding

学习中

  • 博客(20)
  • 资源 (1)
  • 收藏
  • 关注

原创 如何在React移动端项目引入UnoCSS及实现热更新

本文介绍了如何在一个React+TypeScript+Ant Design项目中集成UnoCSS原子化CSS引擎。通过配置craco.config.js引入PostCSS插件,设置uno.config.ts定义扫描规则、预设和转换器,并在入口文件引入生成的uno.css。关键步骤包括:安装所需npm包、配置开发脚本、调整Webpack设置,以及验证新增样式是否自动更新到uno.css文件。该方案解决了文档指引中关于引入和热更新问题,实现了小型项目的快速开发和打包体积优化。

2025-07-03 10:31:28 233

原创 并行接口调用:如何优雅地管理Loading状态?

并行调用接口时,封装中间件统一loading开启关闭流程。

2024-12-25 11:32:17 360

原创 ECharts:解决柱状图数值标签不显示的问题,亲测生效!

调整echars柱状图不显示数字的配置

2024-12-16 18:33:28 1135

原创 【跨域攻略】Nuxt3与PHP的无缝对接:攻克CORS难题的实战技巧!

本次开发用nuxt搭了个单页面看板,通过iframe嵌套进原系统(php+jQuery),但是在接口调用时出现了跨域的问题,因为原接口需要在request head带cookie,但是我使用fetch时默认不会带cookie,只好寻求解决方案。前端通过设置请求头携带cookie和凭证,Nginx配置中添加了必要的CORS相关header,而后端PHP中间件则设置了允许的源和请求方法。这些配置缺一不可,最终实现了跨域请求的成功调用。

2024-12-16 10:22:46 780

原创 iframe嵌入其他系统网站兼容跨域的流程

在这篇文章中,我分享了在老旧jQuery项目中集成看板的挑战。为了避免在原项目中直接编写代码,我采用了创建两个独立项目并通过iframe引入的方法。尽管这种方法解决了代码集成的问题,但引入了跨域问题。通过探索和实践,我记录了解决这些问题的步骤和策略,希望这些经验能帮助其他开发者在面对类似挑战时找到有效的解决方案。

2024-12-09 15:36:09 1296

原创 探索jscolor插件:如何在layui项目中实现8位十六进制颜色选择器

几行代码帮你搞定在layui项目中实现8位十六进制颜色选择器~

2024-10-24 16:26:53 933

原创 获取图片列表高度的方法

使用场景为需要获取图片高度的情景

2024-10-16 10:58:18 203 1

原创 canvas报错Failed to execute ‘drawImage’ on ‘CanvasRenderingContext2D’: Overload resolution failed.解决

错误信息 “Uncaught TypeError: Failed to execute ‘drawImage’ on ‘CanvasRenderingContext2D’: Overload resolution failed.” 表示在使用 JavaScript 的 HTML5 Canvas API 时,方法调用的代码,确保传递了正确数量和类型的参数,并且如果使用的是图像,确保它已经加载完成。如果图像是动态加载的,可能需要在图像的。方法的调用没有成功。等是绘制图像的坐标和尺寸。的参数不正确或不支持。

2024-07-25 15:10:30 5656

原创 完美解决umi+ProLayout 部分菜单动态的问题

umi+ant pro layout动态菜单配置

2023-08-25 17:23:47 855

原创 用js实现一键复制功能

前导这是一个很简单的功能,拆解出来其实只需要一步,调用clickboard的API即可实现引入首先要引入js<script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.6/dist/clipboard.min.js"></script>html代码:copyMessage 就是我们最后要复制的内容,这里我设置的是个变量.需要在API中绑定 class="clickboard"<div id="app">

2021-12-03 18:40:04 1712

原创 用vuejs实现滑动解锁功能(简单版

用vue实现滑动解锁功能功能说明滑块从左滑动到右,即可解锁功能拆解(8-10条目前还没写,不过不影响使用功能,等我不懒的时候补吧~页面布局开发 ✅锁定滑块dom ✅监听滑块鼠标点击事件(即滑动开始 ✅监听滑块鼠标松开事件(即滑动结束 ✅滑块鼠标点击和松开事件中的滑动距离 ✅根据滑动距离修改滑块所在的位置 ✅监听鼠标动作 做到实时修改滑块位置 让动作看起来更连贯 ✅对滑块滑动的样式增加动画效果规定滑块滑动区域 限制规定区域内允许滑动,超过区域则滑块恢复原位滑动成功解锁功能动画特效

2021-12-03 15:54:36 1782

原创 antd的a-affix切换标签页样式错位问题解决

问题描述我们在满足需要操作吸顶的需求,通常会用到a-affix。这个antd组件可以很方便的满足我们的需求。只要在需要吸顶的部分使用这个组件,并指定容器(详见antd文档=>api=>target)就可以正常使用。但是组件有点小bug,这个bug还蛮容易复现的。我们在切换页面时,会发现affix组件溢出了原容器。官方对此的回答:发现问题解决方案这个时候可以发现,当页面开始滚动,则溢出的部分就会恢复正常解决问题代码结合上面的想法,我们在页面active的时候,把容器滚动1

2021-11-12 17:08:51 1755

原创 还在用三元表达式吗~链判断运算符满足你的需求

还在用三元表达式吗~链判断运算符满足你的需求平时在我们的开发中遇到链式调用,经常会需要判空,防止代码取值报错。ES2020给我们提供了一个简单便捷的方法:“?.”,那么要怎么用呢,我们一起归纳一下。为什么要用?.代码编写中,需要从data中取item中的name的值,我们可以写成:data.item.name,但是这样是有风险的,如果data为空,则代码会报错。判断也可以解决,写法为:data&data.item&data.item.name,但是这样代码太过于冗长三元运算符也可

2021-11-12 16:54:20 542

转载 前端的设计模式(列举9种

设计模式结构型模式外观模式:为子系统中的一组接口提供一个统一的高层接口,使子系统更容易使用。代理模式:如ES6的Proxy。解决以下问题:增加对一个对象的访问控制当访问一个对象的过程中需要增加额外的逻辑实现需要的条件:真实对象代理对象接口创建型模式工厂模式:制造其他对象的对象,随着传入工厂对象参数的不同有所区别。提供一种集中化、统一化的方式,避免了分散创建对象导致的代码重复、灵活性差的问题。用处:构造函数过多,不方便管理,且需要创建的对象之间存在某些关联。

2021-09-07 17:52:39 346

原创 ES6常用的判断对象不为空的办法

ES6判断对象是不空的办法let data ={};if(JSON.stringify(data)=="{}"){ //data不为空}let data={}if(Object.keys(data).length>0){ //data不为空}如果直接用if({})来判断,是无效的.因为if({})是true

2021-08-27 18:39:54 1960

原创 Git的总结与指令详解

Git的总结与使用详解git是什么?git是分布式版本控制系统分布式系统:多个能独立运行的结点组成,各个结点利用网络进行信息传递,从而实现共同的目标或任务。git的分区工作区直接编辑代码的地方,可以直接操作并看出修改内容暂存区/缓存区数据(快照)暂时存放的地方版本库或本地仓库存放已经commit的数据,push的时候,就把这个区域的数据push到远程仓库远程仓库git的使用环境mac系统不需要安装(因为mac系统是linux系统,可以直

2021-08-16 16:57:35 143

原创 Vue 跨域请求报错No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.

坑是一个一个踩出来的。。。报错如下:Access to XMLHttpRequest at 'http://apps.eshimin.com/traffic/gjc/getArriveBase?name=***&lineid=***&direction=1&stopid=12' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin

2021-01-06 17:31:53 2018

原创 vue项目js引入图片显示不出

错误代码:把引入路径改为:require('../../assets/img/2.jpg') 即可。原因:vue以为这是一串字符串,而不是图片路径。多踩坑才会成长呀~

2021-01-05 16:00:58 783

原创 Vue项目启动报错 !!vue-style-loader!css-loader?{“sourceMap“:true}!

今天新加了几个页面,初始化页面的时候,用了vbase命令,引入了router之后,项目启动报错,如下:ERROR Failed to compile with 4 errors ...

2021-01-04 15:56:53 5001

原创 Vue 项目启动报错:http://eslint.org/docs/rules/no-unused-vars

Vue项目启动时报:✘ http://eslint.org/docs/rules/no-unused-vars 'vm' is assigned a value but never used src\navigation\nav.vue:13:5解决办法:将项目中/config/index.js的useEslint:true,改为useEslint: false,重启即可。...

2021-01-04 15:23:23 2782 1

echars文件,用于ts引入

支持ts引入的echars文件

2024-12-09

ECharts地图散点图全球国家地图与中国省份地图json数据

地图JSON数据结合echars散点图提供了展示全球国家地图以及中国各省份的地图,可以被ECharts库解析并渲染成交互式的地图视图

2024-12-09

git分区.pages

git分区.pages

2021-08-25

空空如也

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

TA关注的人

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