- 博客(40)
- 收藏
- 关注
RSS订阅原创 ExcelJS 下拉选择 dropdown、 加密(encryption)文件 、导出文件
使用 ExcelJS 给某一列设置下拉选择 的 3个方法。
2024-01-10 17:59:41
663
原创 为什么react call api in cDidMount
3、渲染过程是非常快的，即使放到了cWM，也不会让接口快很多。API数据到达前端的时候，必定晚于初次渲染。必定会导致re-render，因此，放到cWM也会导致重新渲染。5、ssr 会让cWM走一次，然后管理端再走一次。–本人未实践，参考资料里这么写的。4、如果放到cWM，会让人误以为等到数据拿到后才去渲染页面。2、17版本后的react 由于fiber的出现导致 cWM 会调用多次！首先，放到constructor或者cWillMount不是语法错误。（那么，17之前的react为什么要如此建议呢？
2023-12-23 21:05:07
660
原创 ts declare 的用法、和export的区别、*.d.ts的使用说明
首先声明，declare 来声明全局变量或类型的目的是为了让 TypeScript编译器能够识别和理解这些外部环境中已存在的内容，而不需要在当前文件中提供具体的实现或定义。特点：如果一个全局类声明文件在 ts 处理范围内， 那么全局类声明文件中的 declare 会在全局生效。其他文件使用.这样就不用import了！*.d.ts文件 的 使用说明。
2023-12-05 11:27:46
1943
原创 debounce and throtlle
注： //在 JavaScript 中，arguments 是一个类数组对象，它表示传递给一个函数的参数集合。通过使用 arguments。对象，你可以在函数内部访问到传递给该函数的所有参数，即使你在函数声明中没有明确指定这些参数。
2023-11-04 17:04:05
322
原创 React的useEvent 和 ahooks 的 useMemorizedFn 的深度分析和对比
由此我们看出。其实二者的原理和出发点都是一致的，都是返回的是个固定的对象obj，该对象地址不变，但是调用的方法的时候相当于调用了obj.A，此属性的指向是会一直更新的。只不过更新的时候 ：useevent用了useLayoutCallback做更新，useMemorizedFn则使用了useMemo。保持地址不变的时候：useevent用的是useCallback ，useMemorizedFn使用的一个!memoizedFn.current + 新固定的function。
2023-10-31 12:04:51
628
原创 useswr基础使用和问题总结
useSwr 使用分析1、第一个参数是key ,下文是写成 getKey() 方法 返回的数据会给到第二个参数的入参。2、写成 key ，要保证全局是唯一的！重复的key 会被useswr认为是同一个，使用同样的缓存3、分页接口的情况下，必须写成 getKey() 方法，getKey的依赖项变化时，会导致 接口从第一页重新请求。4、return null 就是不调接口。1、就是接口函数，普通的useswr 直接用接口函数即可。
2023-10-29 11:32:52
744
原创 super(props)与react类式组件
super是对父类构造器的调用。使用了后会自动继承父类的属性。要把super（）放到第一行是因为了以防在super（）之前，也就是没实例化父类之前，访问父类的属性。所以js将此作为一个语法点，必须这么写。网上看到很多回答 说是：不加props 构造器里没法访问 this.props。我试了根本不是这样。而是直接报错如上图。如果不加props，又调用了父类的构造器，就没把属性值传给父类啊！父类的属性都是undefined。
2023-10-28 18:49:30
108
原创 umi - history传参
params \ search \ state 其中 state不展示到页面。hash路由模式下，刷新会丢失。以下是 umi history.push 的入参定义的。解答：定义一个不存在于history.push入参里的属性即可。
2023-10-10 17:44:21
532
原创 antd Form 监听数据变化的2种方式比较。onValuesChange vs Form.useWatch
此方式类似于 使用useState包裹的数据。
2023-09-07 14:27:50
2984
原创 微前端学习 - 问题记录
微前端、initGlobalState、onGlobalStateChange、获取最新initGlobalState数据、访问主应用的initGlobalState、webpackConfig 和 devServer
2023-08-31 11:27:24
40
原创 antd4 Form 自定义组件、以及改变表单数据的方式
参考例子注意点：被Form.Item包裹的【自定义组件】都会默认给传 一个 onChange 和 当前 formItem包裹下的数据value , 此value被form表单托管的此处的onChange跟普通的 组件的onChange是有区别的。（1） 普通组件是： 【onChange监听，setState 赋值 + value=state 】 控制受控组件的。在form里不能这么做，会导致有2个控制源同时更改同一个表单项。
2023-06-21 11:08:38
1187
原创 antd upload踩坑
当我们想要上传图片的时候，需要修改showUploadList={xx} + listType={xx}。同时，如果是卡片格式 那么Upload组件需要添加Image子组件。首先，这个例子里就先去调用logoUploadForm方法。获取到返回的数据后，做一些处理，生成newUploadInfo。其次，newUploadInfo的一个属性 url 才是真正的上传的接口，被传递给。项目中上传可能并不会直接给前端一个 上传的action对应的url。Upload组件是antd的上传组件。
2023-06-02 18:11:14
238
原创 useLayoutEffect与页面渲染
分析：首先点击了button ,testA变为大于0.5的数字，此时进入useLayoutEffect，如果按照上述的理解，useLayoutEffect是渲染前执行的，那么此时虽然 testA > 0.5 但是redDiv是还没来得及渲染出来呢！就不能获取到真实dom。输出：如果按照大多数资料里的意思，useLayoutEffect 是渲染前执行的，怎么可能获取到 真实dom（id=redDiv 的div）呢？
2023-04-24 18:26:10
147
原创 React性能优化之常用hook的解析
下图是 useEvent的大致的源码。返回的是ref.current的引用。当任意state发生变化时，即可冲洗执行ref.current = handler 此时的闭包环境就变了。注意： useMemorizedFun与useCallback 的使用场景。功能和缺点：生成一个根据依赖项变化的方法。useLayoutEffect文档：参考1 的例子 + 参考2 的结论。：react官方出的一个，返回无依赖项的地址不变的方法。2、useMemorizedFun：功能同上，是ahooks的方法。
2023-04-03 10:06:59
180
原创 react useMemo的使用心得。为什么总是拿不到最新数据
导致所有的数据，只要是从子组件momeTest中执行importCallback，都会是旧的，包括父组件的所有方法、state等。除非update发生了改变，触发了momeTest的重新渲染！如果我们给子组件里用了useMome，且子组件里用到了父组件传一个state。那么即使是父组件的fatherState变化了。：在子组件中，执行importCallback时，拿到的数据是最新的。importCallback方法被传到了子组件，并放在了useMemo使用。，因为使用了useMemo导致。
2022-11-06 14:38:34
800
原创 有关 dva.js effects 的参数 ：put、call、take、put.reslove阻塞性、异步
有关 dvjs effects 的参数 ：put、call、take、put.reslove阻塞性、异步。
2022-09-26 11:45:41
1506
原创 umi 项目，ts文件里引用 mockjs，总是飘红提示mockjs不存在。
3、npm uninstall 模块：删除模块，但不删除模块留在package.json中的对应信息；2、dependencies是会发布到生产环境中去的，就是项目开发完成给用户使用的时候，依赖也是生效的，如我们开发使用的组件库之类的，生产环境一定要用到的就一定要写在dependencies；1、当使用npm install --save时，依赖就写到dependencies对象中去，当使用npm install --save-dev时，依赖就写到devDependencies对象中去。
2022-09-09 17:44:31
1364
原创 XLSX 相关使用
好像是sheet_to_json()的时候。只要有了{raw:false}，就会直接读取 w的值，不是转换过后的数据。加了上述2个配置那么，影响的只是 workbook 的这个 v 的结果。不会影响 w的结果。我发现这种情况下，加不加 dateNF 和cellDate 这2个配置 都是一样的结果。其实他的关键点就是 {raw:false} ，就是以字符串形式读取 单元格里的内容。这里打印出来的一大串是 workbook 里面的结果。
2022-09-07 10:48:38
149
原创 echarts自定义仪表盘实现特殊功能：轴线渐变（半透明） + 刻度颜色变化 + 仪表盘轴线宽度自适应
轴线360度渐变（不是使用图片）+ 刻度颜色渐变 + 仪表盘轴线宽度自适应
2021-12-14 17:43:50
4311
原创 react 性能优化之：react.memo 有效阻止父组件更新带来的子组件也重新渲染的问题。
前言:如果父组件的state发生变化，那么就需要重新render。其下的子组件即使没有用到此state，也会跟着重新render。性能受影响。现有方法 react.memo 能实现，只有当子组件的 props里的数据发生变化后，才会重新render。注：此方法是浅比较。父组件父组件的input框输入的时候，会引起 inp_value 的变化。必然引起父组件的重新render。但是此时并没有引起子组件的renderexport default function Reactuse() { co
2021-12-09 12:05:18
8605
原创 react 里使用 antd modal对话框，加载echarts图表，无法显示
如题，我给modal对话框加了个key，并给key一个变化的量，导致问题如下：1、modal加载时会闪烁。原因猜测：因为usestate的时候，去请求了数据，导致数据又次更新，modal由于key不同再次加载，所以才闪烁2、里面用了echarts图表，导致数据来了，echarts也生成了。但是页面重新加载了。导致数据又没了。echarts渲染的较快，无法显示在div上了3、地图加载了多个问题图片修复后...
2021-11-30 15:38:13
2175
1
原创 使用antd table组件，分页获取数据，实现跨页多选
一般直接批量不分页去获取数据的时候，跨页多选是很容易实现的。当分页去获取的时候，rowSelection的onChange属性对应的函数的参数，就只是当前页面的被选中的数据组成的数组，不包含其它页面。因此如果根据这个函数的返回值来确定selectedRowKeys，那么就会丢失之前选中的数据。因此核心思想就是，如何将之前页面的被选中的数据也存储到selectedRowKeys。方法1：通过将之前的和现在的selectedRowKeys进行解构赋值，合并到一个数组里、去重、再根据下面2个api的回调函数
2021-11-16 10:22:03
8474
1
原创 react Error: Objects are not valid as a React child (found: object with keys {username, password})
报错的原因是，这里的user是个object类型的数据。react里面不允许直接去在页面里展示object数据。改成这样就行了.展示字符串或者数字啥的普通数据类型
2021-10-05 12:29:27
799
原创 better-scroll 插件 在mac上使用的注意点---持续更新中
better-scroll mac的触控板上无法双指滑动滚动1、首先在浏览器上切换一下手机型号2、只能拖拽滚动，不能双指滑动。即只能单个手指按住触摸板，然后上下滑动。气死我了找了半天的原因。偶然试出来的。...
2021-08-13 15:35:12
284
1
原创 如何在vue项目中使用vue-awesome-swiper插件制作轮播图 之 版本2.6.7
1、安装插件npm i [email protected] --save注：我这里安装的是，2.6.7低版本的，只适用于此版本如果遇到问题，可从github上寻找答案。下面链接是针对此版本的使用介绍https://github.com/surmon-china/vue-awesome-swiper/tree/v2.6.7如果遇到其他问题，可以先到此路径下的issue中寻找答案。2、创建一个组件。swiper.vue（名称任意）<template> <di
2021-08-12 10:57:34
459
原创 错误解决 node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules
一、问题如图意思是后面的文件里缺少 前者的引入二、问题如图解决办法也是将iconfont文件插入到vue文件里
2021-08-10 11:30:43
37485
原创 有关node 升级 或者npm升级之后，不能用的问题的解决方案。以及安装webpack太卡的解决方案汇总
有关node 升级 或者npm升级之后，不能用的问题的解决方案。以及安装webpack太卡的解决方案汇总提要：为什么要升级，因为安装webpackage的时候，太慢了，慢到窒息。我前一天晚上安装的，到第二天早上还是失败一、安装webpack太卡解决方案汇总1、使用cnpm使用npm下载cnpm，npm install -g cnpm --registry=http://registry.npm.taobao.org2、给npm更换淘宝源来下载webpacknpm config set regi
2021-08-04 11:43:50
1029
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人