落落的前端学习之路-CSDN博客

懒加载的时候由于不断更新列表项内部的高度，因此就会使浏览器自动触发滚动事件，而滚动事件又触发懒加载的更新，形成死循环，造成自动滚动的问题。在父元素中添加样式overflow-anchor:none就正常了。不知道为啥只有react18，root.render()方式才会有问题。页面内容高度发生变化引起滚动条跳动的问题。浏览器会自动触发onscroll事件，调整滚动条的位置，让滚动条不乱跳动;...

2022-08-12 14:22:02 1019

原创 electron+react 用户自定义安装路径

electron 自定义安装路径

2022-07-14 16:58:56 693

原创 Typescript Interface 覆盖继承的接口定义

使用方式参考地址

2022-06-30 14:16:39 994

原创纯前端导出excel 插件xlsx和file-saver

纯前端导出excel 插件xlsx

2022-06-22 16:49:21 508

原创 electron nodejs上传文件获取文件流

使用antd upload组件，electron中ipcRenderer.invoke无法传递文件流；传文件路径过去，然后使用nodejs获取文件流 // 创建数据流 const readerStream = fs.createReadStream(path) const formData = new FormData() formData.append("file_name", readerStream) formData.append(

2022-05-31 14:06:55 716

原创 react-infinite-scroll-component 第二次加载无法触发next

react-infinite-scroll-component 是一款滚动加载插件，在页面滚动的时候加载数据，在使用过程遇到一个坑。坑的描述：在页面滚动的时候，infiniteScroll页面数是自动+1,打个比方说，页面加载到第三页，infiniteScroll无法在重新开始计数，而在某些场景中需要重新开始计数，比如说页面在加载完之后，页面进行搜索功能，然后再取消搜索，page number需要重新计数解决方案：改变infiniteScroll的key值...

2022-05-31 14:04:29 1761

原创 electron IPC通信报错Uncaught (in promise) Error: An object could not be cloned.

项目场景：electron+react问题描述electron 中用IPC通信Uncaught (in promise) Error: An object could not be cloned. e Error: An object could not be cloned. at EventEmitter.i.invoke (node:electron/js2c/sandbox_bundle:33) at uploadImg (YakitPluginInfo.tsx:360)

2022-05-26 14:19:51 9495

原创 JS下载图片保存在本地

const imgUrl = "";// 图片链接 const a = document.createElement('a'); // 这里是将url转成blob地址， fetch(imgUrl) // 跨域时会报错 .then(res => res.blob()) .then(blob => { // 将链接地址字符内容转变成blob地址 a.href = URL.createObjectURL(blob); ..

2022-05-16 11:46:20 4911

原创 IIS后台网站部署不支持PUT方法 405错误

在web.config文件中添加如下代码；删除模块WebDAVModule<system.webServer> <modules runAllManagedModulesForAllRequests="true" runManagedModulesForWebDavRequests="true"> <remove name="WebDAVModule"/> </modules> </system.webServer>.

2022-05-07 10:47:53 778

原创 CSS 实现轮播图

<div className={styles.banner} > <div className={styles.wrapper} > <ul className={styles.shufflingBody}> <li className={styles.shuffling}>1</li> <li

2022-04-18 15:02:16 1213

原创本地项目antd 修改.less文件导致内存溢出

项目场景：antd 项目，修改less文件会导致内存溢出问题描述本地环境antd 项目，修改less文件会导致内存溢出；如下FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory原因分析：这个错误信息告诉我们，JavaScript的内存溢出了；百度后；试了两个方案：方法一：添加参数 --max_old_space_size=4096npm run start --max

2022-04-14 14:58:20 1375

原创 umi config.js整体defineConfig配置

import { defineConfig } from 'umi';export default defineConfig({ hash: true, // 配置是否让生成的文件包含 hash 后缀，通常用于增量发布和避免浏览器加载缓存。 history: { // 配置 history 类型和配置项 type: 'hash' // 可选 browser、hash 和 memory }, base: '/', // 设置路由前缀，通常用于部署到非根目录。 publicPat

2022-04-08 11:39:58 9158

原创常用正则表达式

switch (type) { case 'mobile': // 手机号码 return /^1[3|4|5|6|7|8|9][0-9]{9}$/.test(str); case 'tel': // 座机 return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str); case 'card': // 身份证 return /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.

2022-03-29 17:12:18 234

原创 Mysql Incorrect DATETIME value: ‘01/01/2021 00:00:00‘

服务器时间格式不一致，转换时间格式start.ToString("yyyy-MM-dd HH:mm:ss")

2022-03-28 14:11:03 936

转载 js Math函数

在控制台直接打印console.dir(Math)看全部方法.属性Math.E //2.718281828459045 自然对数的底数这是高中知识？Math.LN2 // 0.6931471805599453Math.LN10 // 2.302585092994046Math.LOG2E // 1.4426950408889634Math.LOG10E // 0.4342944819032518Math.PI // 3.141592653589793 就认识这一个就是πMath.

2022-03-27 21:12:58 93

原创 vuex mapGetters使用

// formStatisticsFoundation.js ，命名空间为formStatisticsFoundationgetters: { zzStatisticsData(state) { const statisticsData = state.statisticsData; const data = [{ name: '企业数', number: statisticsData.enterpriseNumber }, { name:

2022-03-22 17:52:35 1155

转载 JavaScript数组去重

一、利用ES6 Set去重（ES6中最常用）function unique (arr) { return Array.from(new Set(arr))}var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];console.log(unique(arr)) //[1, "true", true

2022-03-21 10:00:34 80

转载微信小程序 - 富文本图片宽度自适应（正则）

原文连接引言：在微信小程序里，比如商品展示页面的商品详情会有图片展示，PC端设置的商品详情是PC端的宽度，所以在小程序里图片会显示不全，这时就应该做相应的处理，使小程序里图片显示正确思路把图片的宽度改为手机屏幕对应的宽度微信小程序需要知道的知识需要知道微信小程序里有自己的宽度标准，单位为rpx；针对所有不同尺寸的浏览器，微信小程序里规定屏幕宽为750rpx；解决WXML<view class='html_detail'> <rich-text nodes='{{a

2022-03-18 10:15:21 1081

转载 VSCode设置ESLint语法检查

转载 "eslint.validate": [ "javascript", "javascriptreact", "vue-html", { "language": "vue", "autoFix": true } ], "eslint.run": "onSave", "eslint.autoFixOnSave": true

2022-03-03 10:56:50 519

转载 Only digits (0-9) can be put inside [] in the path string: formData.XXX

使用uniapp开发时微信小程序中爆出的问题，问题在于form表单组件中绑定表单值,去除报错值则正常。解决办法如下：修改注释行内容，转载连接

2022-02-22 09:29:23 1909

原创同一个表中查询每个分类的前5条数据

select a.Id,a.Type,a.Title,a.ShowTime,a.UserName,a.ExternalLinks,a.Cover,a.PlainText, a.IsState,count(*) as num from (select * from news where IsState=1 and IsDeleted=0) as ainner join (select * from news where IsState=1 and IsDeleted=0) as b ON a.Typ

2021-12-31 14:44:57 1059

原创用纯CSS禁止鼠标点击事件以及禁止鼠标样式

pointer-events: none;cursor: not-allowed;

2021-12-21 16:52:37 2640

转载 React 解决鼠标移入子元素触发父元素的mouseout事件

方法一、用mouseleave/mouseenter代替mouseover/mouseout【最佳方法】mouseover 与 mouseenter:mouseover => 不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。mouseenter => 只有在鼠标指针从元素外穿入被选元素（到元素内）时，才会触发 mouseenter 事件。mouseout 与 mouseleave:mouseout => 不论鼠标指针离开被选元素还是任何子元素，都会触发

2021-12-21 15:07:08 4085

原创 Css fade()函数降低颜色变量透明度

@primary-color颜色变量 background-color: fade(@primary-color, 20%);

2021-12-16 14:41:00 3075 3

原创 uniapp 微信小程序打包 vendor.js过大导致打包超过2M

1、分包加载，小程序限制一个包2M，可以分9个子包，整包共计不能超出20M，这一步很简单，如果看文档感觉枯燥的可以参考uview框架的demo，因为这个demo就使用了小程序的分包机制，demo链接（下载示例项目即可）：https://ext.dcloud.net.cn/plugin?id=15932、使用分包之后会发现遇到了一个奇怪的问题，子包的组件和js文件会被打包到主包的vendor.js文件中，这就导致了vendor.js过大引起主包超过2M解决方案：开启分包优化，打开manifest.jso

2021-12-16 09:09:56 5067

react devtool

dotnet-hosting-2.2.2-win.exe

空空如也