- 博客(110)
- 收藏
- 关注
原创 【React 函数式组件知识点】
useEffect 是在组件挂载后异步执行的,并且执行事件会更加往后,如果我们在 useEffect 里面改变 state 状态,那么页面会出现闪烁(state 可见性变化导致的)。而 useLayoutEffect 是在渲染之前同步执行的,在这里执行修改 DOM 相关操作,就会避免页面闪烁的情况。在这里,111 会在 useComponentWillMount 之前执行,而在 class 的 componentWillMount 中,是优先其他代码执行的。
2024-03-14 23:30:51
647
原创 react中使用 react-draggable 问题总结
是在使用 React 时经常用到的拖拽库,不过在使用时,下面是一些常见的问题,做此记录。解决方案:使用onTouchStart来替换onClick事件。解决方案:通过手动维护一个“是否处于拖拽状态”的标识来做判断。
2024-01-08 23:09:47
1620
原创 React Native expo Android adb 调试出现 device not found 怎么办
3、检查adb是否启动成功,在命令行输入adb kill-server回车后再重新启动,启动命令为adb start-server,看是否可以启动成功,如果不成功可以看到报错信息,一般情况为端口占用,可以给adb重新设置端口,再次重新启动。最近接了一个项目,app 壳子跳转 webview 内嵌 h5 页面,但是壳子是另外一个团队负责的,我们没有源代码,没法办法调试。沟通排查问题很麻烦,后来发现了。1、确保手机已经打开开发者模式,并且开启usb调试,首次开启后需要拔线重新连接,并且授权usb调试。
2023-12-04 17:11:45
740
原创 Mysql 连接 IP 发生变化的问题
最近使用 nodejs 连接远程 mysql 数据库时,我的 ip 竟然发生了变化,查找了很多资料都无法解决,而且当我改一下 ip 时,就可以连接了,心想是不是有什么代理软件导致的,排查了一遍,没有任何代理。**最终查询资料才知道,我的 mysql 数据库没有开启 root 远程访问权限,所以 nodejs 在连接时,如果连接不允许,就返回了一个其他的 ip **实际上我的 ip 不是。
2023-06-15 11:12:39
828
原创 修改滚动条样式的方法
:-webkit-scrollbar-button 滚动条轨道两端的按钮,允许通过点击以微调滑块的位置。::-webkit-scrollbar-corner 当同时有垂直滚动条和水平滚动条时的交汇处。::-webkit-scrollbar-track-piece 滚动条没有滑块的轨道部分。::-webkit-scrollbar-track 滚动条的轨道(里面装有thumb)::-webkit-scrollbar-thumb 滚动条里面的滑块。对此有了一些了解之后就可以上手滚动条样式的修改了。
2022-11-10 11:24:51
632
原创 element-ui的table在flex布局下宽度一直增大的问题,解决了!!(亲测有效果)
el-table的父元素不能是flex:1的元素,需要在外面再加一层元素,并且父元素设置成absolute,祖父元素设置成relative即可。今天开发博客后台界面时遇到了这个问题,百思不得其解!
2022-10-31 10:51:59
2499
转载 解决libc.so.6: version `GLIBC_2.18‘ not found问题
下载:wget http://mirrors.ustc.edu.cn/gnu/libc/glibc-2.18.tar.gz。运行:strings /lib64/libc.so.6 |grep GLIBC_运行configure配置,make,sudo make install。解压:tar -zxvf glibc-2.18.tar.gz。发现没有GLIBC_2.18。
2022-09-14 23:25:59
1730
转载 CSS模块化方案
CSS Modules 是很好的 CSS 模块化解决方案,优势很明显,几乎没有学习成本,也不依赖任何的第三方库,并且对代码的侵入性也非常的小。背后的思想:分离逻辑组件和展示组件使用 Styled components,可将组件分为逻辑组件和展示组件**,逻辑组件只关注逻辑相关的部分,展示组件只关注样式**。Styled-components 最基本的理念就是通过移除样式与组件之间的对应关系来强制执行最佳实践。转载于点击此处。
2022-09-13 11:19:56
184
原创 关于 node-pre-gyp install --fallback-to-build 的解决办法
百度说是由于node源的问题,但笔者本身就是tb源。然后再重新跑一遍上面流程就可以了。今天刚开工,发现项目不能运行了。然后重新npm install。
2022-09-08 11:30:37
6179
原创 Mac 下 安装 brew
Mac下安装 brew解决brew报错:Another active Homebrew update process is already in progress
2022-08-31 07:05:31
212
原创 使用gulp的服务器插件 gulp-server 开启一个服务器
前端很多时候我们要启动一个服务器去访问打包后的静态文件,放。太重,使用其他的第三方工具也很重,幸运的是,我们有。然后就开启成功了 😄😄😄😄😄😄😄,就是简单。这种功能强大的工具链,直接看下面代码…
2022-08-24 14:24:16
1100
转载 Vue 配置全局样式(style-resources-loader)
在样式引入时,对于变量的引入,需要在每个文件里都要引入一遍,为了避免每次使用时都需要单独引入一遍的问题,采用了。在确保安装指定CSS 解析器插件(|…)后。这里以less举例,新建一个reset.less(文件名随意),路径为。// 这里的路径不能使用 @ 符号,否则会报错.content {}单纯的在main.js文件中引入是无法实现全局样式的,这种方式是错误的。下面两种配置方式都不需要在main.js文件中引入,配置好之后直接使用即可。
2022-08-19 14:48:00
4533
1
原创 yarn 安装和更换源
npm也可以更换源,不过实测,更换源之后,搜索命令npm search无法使用,需要使用对应的网页搜索,要使用搜索,删除registry即可。yarn更换源为国内镜像,npm保持搜索功能!
2022-08-19 14:31:21
4192
原创 Blob 对象介绍
看下面代码,可以使用文本构造 Blob 对象示例:使用 Blob 创建一个指向类型化数组的 URL另一种读取 Blob 中内容的方式是使用 Response 对象。某些时候后台下载文件返回到前端被转换为 Blob 对象,正常下载时,返回正确的文件流,异常时,后台返回一段包含错误信息的 json ,这时候需要提示用户下载失败,看下面代码...
2022-07-06 15:52:57
1661
原创 base64转化字节流
一般来说,下载文件时,后台直接返回文件流,我们可以在前端直接打开,或者是利用 Blob 接收 ,之后利用 fileSaver 库或 a 标签下载。但是某些时候,后台将文件直接存成8位二进制到数据库,然后直接返回,到前端的是编码后的字符串。 这就是 base64字符串,这个字符串可以直接在嵌入到页面显示,如果需要用 Blob 接收,则需要先转化为 ArrayBuffer,下面就是转化到方法,转化成 ArrayBuffer 对象后,就可以用 Blob 接收了。话不多说,直接上代码 /** * bas.
2022-05-14 22:04:08
3111
转载 elementUI el-table合并单元格
合并单元格,如果id列值一致,则合并。<el-table :data="tableData6" :span-method="objectSpanMethod" border style="width: 100%; margin-top: 20px"> <el-table-column prop="id" label="ID" width="180"> </el-table-column> <el-table-column pro
2022-03-21 13:46:24
612
原创 前端组件测试相关链接
作为一个前端开发者,一直对组件测试非常感兴趣,但是也挺迷茫,组件测试到底测试什么,市面上的测试框架到底有哪些,有什么区别,该如何着手开始学习组件测试,下面是一些写的非常好的文章,记录一下。记一次简单的vue组件单元测试...
2022-03-11 09:44:58
1425
转载 vue中动态化的按需使用keep-alive
主要讲下啥是 keep-alive、具体到项目中怎么用的问题。项目相关:panda-mall1、啥是 keep-alive?就是缓存,我们还是来看看具体的使用场景。首先简单一点,第一种比较普遍的场景,当我们从首页–>列表页–>商详页–>再返回,这时候列表页应该是需要keep-alive的。然后第二种,当我们从首页–>列表页–>商详页–>返回到列表页(需要缓存)–>返回到首页(需要缓存)–>再次进入列表页(不需要...
2022-03-09 16:56:40
774
转载 自适应方案:在vue项目中使用postcss-px2rem
在src目录下创建 viewport.js文件下载:https://github.com/imochen/hotcss/tree/master/src这个JS是用来在页面打开的时候给HTML根加上适配的字体大小然后在main.js下添加:import ‘./viewport.js’这里强调下为什么不使用lib-flexible插件个人在使用lib-flexible插件时,感觉没hotcss友好,lib-flexible在页面打开的时候,内容渲染完了才在HTML根上添加适配,这样页面会重新渲染一
2022-03-08 16:19:25
612
转载 vue项目中使用postcss-px2rem的方法总结
vue项目中使用postcss-px2rem的2种方法在项目中为了屏幕适配,经常会用到rem,postcss-px2rem就是为了让我们直接在将代码中px自动转化成对应的rem的一个插件.(下边的方法适用于使用cli2脚手架搭建的项目,现在好多数项目使用cli3搭建,我在后边的文章中增加了对cli3项目自适应的配置.)1.安装npm i postcss-px2rem --save -dev2.设置1).找到项目根目录下的.postcssrc文件module.exports = { "plu
2022-03-08 16:02:25
4629
原创 本人常用的 git 操作命令
git 切换分支git checkout -b dev(本地分支名) origin/dev(远程分支名)git 更改远程源地址git remote origin set-url xxxx.git
2022-02-17 22:14:13
193
原创 pm2 部署 node.js项目踩过的坑
pm2部署指令pm2 deploy ecosystem.json production setuppm2 deploy ecosystem.json production配置文件://ecosystem.json{ "apps": [{ "name": "Ice", "script": "server.js", "env": { "COMMON_VARIABLE": "true" }, .
2022-01-05 16:10:05
1849
原创 TerserWebpackPlugin 去掉 console.log
TerserWebpackPlugin 是 Webpack5+ 用来压缩 js 的,很多时候我们开发环境有很多的console.log、debugger 等用来调试的信息。这些信息肯定不能出现打包后的文件,幸运的是 TerserWebpackPlugin 提供了配置帮我们可以去掉...
2021-12-29 18:05:39
1331
原创 [DEP_WEBPACK_COMPILATION_ASSETS] DeprecationWarning: Compilation.assets will be frozen in future
查看webpack 的官方文档issues,找到相关问题yarn add html-webpack-plugin@next -D
2021-12-27 14:48:05
1205
原创 精准准确的统一社会信用代码正则(js)
参照标准:《GB_32100-2015_法人和其他组织统一社会信用代码编码规则.》按照编码规则:统一代码为18位,统一代码由十八位的数字或大写英文字母(不适用I、O、Z、S、V)组成,由五个部分组成:第一部分(第1位)为登记管理部门代码,9表示工商部门;(数字或大写英文字母)第二部分(第2位)为机构类别代码;(数字或大写英文字母)第三部分(第3-8位)为登记管理机关行政区划码;(数字)第四部分(第9-17位)为全国组织机构代码;(数字或大写英文字母)第五部分(第18位)为校验码(数字或大写英
2021-12-21 09:58:26
1142
原创 mac 安装nvm
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.8/install.sh | bash如果正常安装 就继续安装所需安装的时候报错了 curl: (7) Failed to connect to raw.githubusercontent.com port 443: Connection refused修改地方 系统偏好设置—》网络—〉高级 -DNS 改为8.8.8.8运行如缺少.bash_profile 就进入Use
2021-11-14 13:34:39
438
原创 国内下载vscode速度慢问题解决
首先在官网找到需要下载的文件,点击下载。在浏览器或者下载软件中就可以看到这么一个下载地址了,将其复制下来(如下图箭头所指)。https://***vscode.cdn.azure.cn ***/stable/3a6960b964327f0e3882ce18fcebd07ed191b316/VSCode-darwin-universal.zip然后将上面链接的域名部分替换成 vscode.cdn.azure.cn 之后你会发现下载快的飞起。...
2021-11-13 12:14:33
232
原创 使用npm模块升级工具npm-check-updates
使用npm模块升级工具npm-check-updates首先离不了安装npm install -g npm-check-updatesorcnpm install -g npm-check-updates使用ncu检查当前可升级依赖再使用ncu -u更新package.json文件之后正常安装依赖npm install就可以了作者:老白_啊链接:https://www.jianshu.com/p/b557dbc76513来源:简书著作权归作者所有。商业转载请联系作者获得授权,非
2021-11-12 11:49:07
1075
原创 Vue 如何动态编译 HTML
Vue 项目中用到其他的原生js组件,想动态编译 html,但没有找到好的办法,这里作一下检索到的可能解决方案记录,后续仔细看看VueJS 如何编译服务器端远程模板【异步组件+简单方法】
2021-11-09 11:35:18
1100
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人