react
文章平均质量分 57
闲鱼_JavaScript
得不到的才是最弥足珍贵的
展开
-
nest中使用svg的一种模式
`nest`中没法使用变量形式集体引入图标(非`public`中资源),所以说本文是在一个文件里面集体引用的。然后对此进行了代码简洁处理,支持模块多元化。原创 2023-08-04 10:25:59 · 195 阅读 · 0 评论 -
antDesignMobile中Switch配合Form使用无效解决方案
`Form`和`Switch`合起来使用无效的原因就是因为`Form.Item`给`Switch`的是`value`值,而`Switch`中监听的是`checked`;所以说我们只需要做一层二次封装即可。非常简单~如下原创 2023-07-27 13:51:41 · 363 阅读 · 0 评论 -
实现栅格形式的进度条+奇特的渐变边框效果
使用css渐变背景实现栅格形式的进度条,可js控制整体颜色,如图封面(一半)~具体实现进来看看。原创 2023-04-20 10:10:41 · 518 阅读 · 0 评论 -
Echarts之移动的点位(图标)图(任何图片)
(1)给定一张图片,在这个图片上有小车或其他动态点位需要以固定线路移动。 (2)echarts默认支持```SVG图片格式```或```JSON地图格式```。本文会转译其他图片为svg(目前仅仅简单转译,如果有其他好的方法直接替换就行了),然后支持echarts调用。原创 2023-01-16 14:40:01 · 827 阅读 · 0 评论 -
n向区域选择(图片)
1. 本文以 react 举例,其他框架实现基本上一致(vue则是@mouseMove 、 @click....)2. 实现原理:对图片进行位置区域选中,判断当前鼠标位置是否在这个区域内,如果在区域内则进行可点击鼠标切换(cursor: pointer),如果此时点击则判断出当前点击的位置是哪块区域。3. 具体需求如果有类似的可以看看逻辑,然后也可以在这个基础上更改4. 本文主要作于笔记,方便以后对类似问题处理。原创 2022-12-20 17:43:21 · 105 阅读 · 0 评论 -
react之模仿elementui的v-loading(加载)功能;react 添加等待加载功能;
1. element-ui(vue的ui框架)的v-loading方法感觉非常棒,于是在react中实现一个类似的功能;2. 功能使用介绍:函数接受两个参数,第一个是HTML或者组件,第二个为当前是否是加载中。根据切换第二个参数实现加载等待效果!3. 功能实现介绍:对传入的组件component.props.children进行操作,在其中添加进需要添加的加载功能代码(自定义加载),使用绝对定位的形式(不要加top、bottom、left、right)。原创 2022-12-02 15:10:48 · 818 阅读 · 0 评论 -
js之接口单例模式:全局拦截接口(比如说数据字典)只请求一次!无论后续如何调取接口只走接口缓存。
1. 本文以umi3(react框架)来举例子;axios操作一样的,只不过得去看看如何取消接口请求,umi-request里面有中间件处理,我这边在中间件处理这块直接不走下一步(return)则完成不走接口请求。2. 逻辑介绍:在请求接口前一步进行拦截判断当前接口,如果为需要缓存的接口则进入逻辑判断;如果已经请求过了则直接取缓存返回接口。如果正在请求则进入心跳等待第一个接口完成,完成后则返回数据给接口。如果没有请求则进行请求。3. 功能介绍:**当接口处于缓存列表中的时候,无论后续如何调取接口只走接口原创 2022-11-30 15:51:29 · 660 阅读 · 0 评论 -
react-andDesign-table之可编辑表格集成封装组件
1. 基于官网进行二次封装而成2. 目前内置两种常用的编辑操作(输入框与下拉框)(默认双击表格后编辑为输入框模式)3. 虽然只支持两种内置功能,但是可以自己添加其他功能(需要的参数基本上都暴露出来了)4. 解决form表单重复key值bug原创 2022-11-10 19:54:10 · 1269 阅读 · 0 评论 -
【疑难杂症】去除浏览器拖拽选中内容产生的地图效果
1. 事情经络:当选中一片内容的时候,然后拖拽这个内容,会发现有这内容的影子被拖着跟着鼠标移动,这其实是浏览器自带的特效功能,可以把你选中的内容快捷拖入文档中.....但是呢在一些特殊的内置浏览器中,这个效果被弄出了白屏拖拽情况。本文译在适配这个bug。2. 功能介绍: (1) 不影响其他正常的选中效果和拖拽效果。 (2)模拟手机端按下、移动、抬起指拇功能,然后在移动的时候禁止触发浏览器默认事件(禁止默认事件则代表着禁止掉拖拽地图bug) (3)在最父级节点做事件监听 鼠标按下、鼠标移动、鼠标抬起原创 2022-10-11 11:59:09 · 326 阅读 · 0 评论 -
React之antdesign官网虚拟列表(Table组件)二次封装
添加功能有: (1) 全选与单选功能 (2)滚动加载功能(虚拟列表级滚动加载) (3)定位某一行 (4)表格字体闪烁功能 (5)可对表头进行隐藏或显示配置,表格内部内容进行宽度适配 (6)高度设置(这块可能得靠你自己再去深度研究一下这块了)原创 2022-09-22 17:19:08 · 4761 阅读 · 5 评论 -
echarts地图各种点位实现
1. 实现地图点位的波纹效果2. 可直接以图片的形式充当节点(替换波纹效果)3. 可对标题做图片显示和文字显示原创 2022-09-19 10:12:00 · 1875 阅读 · 0 评论 -
react antdesign table 添加滚动加载(下拉翻页功能);table 定位实现简单介绍
1. 逻辑并不复杂,首先获取到表格中可滚动那一级dom元素,然后监听它的滚动;当滚动到底了则触发我们自己的函数;2. 全篇幅最主要的一点就是 useEffect 中的内容,其他的都是看你怎么来了;3. useEffect 内容简单介绍: (1)findNeedNode 函数: 递归查找 Table 元素中 className 为 **ant-table-body** 的节点(可滚动那一级dom元素) (2)找到元素后添加监听滚动; (3)判断屏幕高度和滚动条的高度,达到条件后则触发父级传入过...原创 2022-08-29 23:58:05 · 2165 阅读 · 0 评论 -
dvajs的基础介绍及使用
同步操作修改仓库值异步修改仓库值正常这样基本上可以使用dva进行项目描写了,后续介绍再更原创 2022-06-24 18:41:21 · 1217 阅读 · 0 评论 -
useEffect 基础介绍及使用
react hooks useEffect基础介绍及使用描述原创 2022-05-18 16:49:27 · 5401 阅读 · 0 评论