- 博客(155)
- 收藏
- 关注
RSS订阅
原创 浏览器渲染机制和node事件循环
1、libuv 线程池默认打开 4 个，最多打开 128个 线程。（例如：以前 web 服务器同一时间比如说最多只能接收 100 个请求，多的就无法接收了，服务器就挂掉了。nodejs 所谓的高并发是指可以同时接收 1000、10000 个请求，只不过以排队的方式在等待。2、主线程执行js，是单线程的，js代码在做大量计算就是cpu密集了。主线程不空闲出来也没法处理 io 的事，所以就会阻塞了。
2024-07-22 00:40:53
888
原创 两数之和
给你两个 非空 的链表，表示两个非负的整数。它们每位数字都是按照 逆序 的方式存储的，并且每个节点只能存储 一位 数字。输入：l1 = [9,9,9,9,9,9,9], l2 = [9,9,9,9]输入：l1 = [2,4,3], l2 = [5,6,4]请你将两个数相加，并以相同形式返回一个表示和的链表。这样就完成了两个链表的相加，并返回和的链表。输入：l1 = [0], l2 = [0]输出：[8,9,9,9,0,0,0,1]指向新的节点，以便下一次循环添加节点；节点的值，若该节点为空则赋值为 0；
2023-04-10 20:20:56
659
原创 关于使用 react-sortable-hoc 拖动时丢失拖拽元素的样式
在拖动项目时，该元素不再链接到父类，而是父类之外的单独元素。因此它失去了所有的造型！因此为了解决这个问题，我们可以像这样把元素样式定义在全局。使用less样式嵌套。
2023-02-08 16:19:30
1130
5
原创 react17安装react-dnd提示Cannot find module ‘react/jsx-runtime‘解决方案
react17安装react-dnd提示Cannot find module 'react/jsx-runtime'解决方案
2023-02-03 16:37:22
1077
原创 echarts 设置label和labelLine不生效问题
官方： label: { show: true, position: 'outside' }, labelLine: { show: false },实际：label: { normal: { show: true, position: 'outside', formatter: '{c}' }},labelLine: { normal: { show: true, le
2022-04-24 11:30:52
8729
2
原创 关于antd Layout的Content在首次渲染时宽度超出的问题
大概原因是因为项目是layout包裹content，当layout和当前dom都重载时，layout还未render完毕时，当前dom的this.elementRef.current获取的宽度会是整个屏幕；当layout加载完毕，Content会超出原本设定的100%；在layout添加hasSider即可官方文档：布局 Layout - Ant Design...
2022-04-22 23:58:11
1157
1
原创 flex 最后一行 左对齐
场景 ：无法确定flex换行后列表个数又不固定，直接调试html特别麻烦，使用Grid布局Grid布局天然有gap间隙，且天然格子对齐排布，因此，实现最后一行左对齐可以认为是天生的效果。<div class="box"> <div class="list"></div> <div class="list"></div> <div class="list"&g..
2022-04-10 18:29:07
1369
原创 自定义antd table子表格的展开和收起，一键展开收起
效果：代码：import React from 'react';import {Table} from 'antd';const key = []; // 定义一个空的数组。export default class xiaoyu extends React.Component { constructor(props) { super(props); this.state = { open: false, ..
2022-04-07 15:12:25
5607
2
原创 解决Echarts折线图x轴数据较多，展示不全的问题
解决Echarts、echarts-for-react折线图x轴数据较多，展示不全的问题
2022-02-17 18:39:15
10146
3
原创 关于CSS动画播放完后消失
animation-fill-mode: forwards值 描述 none 不改变默认行为。 forwards 当动画完成后，保持最后一个属性值（在最后一个关键帧中定义）。 backwards 在 animation-delay 所指定的一段时间内，在动画显示之前，应用开始属性值（在第一个关键帧中定义）。 both 向前和向后填充模式都被应用。 ...
2021-12-10 17:49:28
3159
原创 使用source-map-explorer分析webpack打包的资源大小情况
Source map explorer使用源地图分析JavaScript包。这可以了解代码臃肿的来源，比如你经常发现打包后的代码文件比较大，但是有不知道该从哪点来分析，那么就可以用这个 Source map explorer 了。要将 Source map explorer 添加到 Create React App 项目中，请遵循以下步骤：npm install --save source-map-explorer或者，您可以使用 yarn：yarn add source-map-.
2021-12-08 10:59:23
1010
2
原创 关于react类组件内函数获取不到this
1、定义2、使用3、报错4、原因当定义React组件时，extends React.Component时，不会将this继承下来。所以this是undefined.而ES6中的arrow function呢，默认在定义的时候会绑定this。使用this一般有两种做法。 直接使用箭头函数 在constructor中绑定。 class { constructor() { super(...arguments); ...
2021-11-24 17:18:47
1521
原创 git push时自动带上远程分支名
1.控制台输入：vi ~/.gitconfig2.把这段代码复制粘贴[alias] pushh = "!f() { if [ -z $1 ];then currBra=`git symbolic-ref -q --short HEAD`;else currBra=$1;fi;git push origin HEAD:refs/for/$currBra; }; f"3.推送时git pushh这段shell脚本的大致意思是，如果你写了指定的地址，那就push到指定地址，如果没写，那就...
2021-10-28 18:58:47
879
原创 升级react版本
1.用npm-check -u检查一下最新版本的包npm-check -u如果没安装npm-check，可以先安装npm install -g npm-check2.选择要更新的包如图我们要更新这两个包，按上下键移动箭头，按空格选择包，按回车更新3.运行项目，检查有没有报错15到16的迁移也同理，可以看这篇文章：技能get，React的优雅升级！ - 袋鼠云dtstack - 博客园 (cnblogs.com)...
2021-10-21 11:40:01
2277
原创 一个项目同时安装两个版本的依赖
背景如项目中有一个2.0版本的ant库，我们不得已必须使用更高版本的ant方案我们可以使用npm的别名，安装不同版本的库如：npm install --save antd-mobile-v5@npm:antd-mobile@next他会和以前的版本共存{ "antd-mobile": "^2.3.2", "antd-mobile-v5": "npm:antd-mobile@next"}使用时引入即可import { Button } from 'antd-
2021-10-20 21:37:39
4729
原创 npm设置别名报错：Invalid dependency type requested: alias
原因：alias 低版本的npm不支持.必须要6.9.0版本以上方案：npm install -g npm或升级到指定版本npm -g install npm@版本号
2021-10-20 21:32:32
9994
原创 Swiper5&6使用方式以及一些坑
1.安装npm install swiper --save2.引入import Swiper, { Pagination, Navigation, Autoplay } from 'swiper' // js 模块import 'swiper/swiper-bundle.css' // css 模块Swiper.use([Pagination, Navigation, Autoplay])swiper只能按需引入css文件夹路径改变3.初始化 // eslint-di
2021-10-15 20:50:25
1700
转载 css改变鼠标样式
元素的样式上加cursor:值cursor其他取值 auto ：标准光标 default ：标准箭头 pointer, hand ：手形光标 wait ：等待光标 text ：I形光标 vertical-text ：水平I形光标 no-drop ...
2021-10-15 15:28:30
216
原创 CSS设置超出几行显示省略号
overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; //行数/* autoprefixer: off */-webkit-box-orient: vertical;word-break:break-all; //英文折行
2021-10-12 22:26:55
1118
原创 TS中的类
类的基本结构class Greeter { greeting: string; constructor(message: string) { this.greeting = message; } greet() { return "Hello, " + this.greeting; }}let greeter = new Greeter("world");如上声明一个Greeter类。这个类有3个成员：一个叫做gre..
2021-09-24 11:45:41
1513
原创 TS的枚举
官方定义使用枚举我们可以定义一些带名字的常量。 使用枚举可以清晰地表达意图或创建一组有区别的用例。 TypeScript支持数字的和基于字符串的枚举。枚举使用enum关键字来定义。理解:枚举是列举固定几个值，用于取值被限定在一定范围内的场景，比如一周只能有七天，颜色限定为红绿蓝等。直接定义变量的话的话可以随意定义，枚举只能使用你定义好的几个值例如你定义一个方法接收一个参数，这个参数如果是int型，别人在调用你这个方法时可以传1或2等任意数字，虽然你告诉了同事，只能传0或1,如果你把..
2021-09-22 14:41:25
15258
原创 JEST断言库（常用api）
Expect当你写测试，你经常需要检查值满足一定的条件。expect 可以访问一些“匹配器”来判断是否能够通过验证如：test('first use expect', function () { expect(1 + 1).toBe(2);});expect.extend我们可以expect.extend扩展自己编写的函数 如：expect.extend({ toNaN(received, argument) { if (isNaN(received)) { .
2021-09-13 19:38:12
2006
2
原创 JEST断言库（安装与demo）
1.新建文件夹2.在文件夹下npm install --save-dev jest或yarn add --dev jest3.新建package.json文件内容{ "scripts": { "test": "jest" }}4.让我们来测试一个简单两个数字相加的function，新建 Sum.jsfunction sum(a, b){ return a + b;}module.exports = sum;5.新建一个Sum.te
2021-09-13 17:10:32
946
原创 Git 提交代码每次输密码，干脆去掉吧~
每次push、pull都要输入密码，烦不胜烦。什么改成ssh，配置git config --global credential.helper store，之后依旧不行。那就干脆把密码去掉吧（最后的倔强）命令格式：ssh-keygen -p [-P old_passphrase] [-N new_passphrase] [-f keyfile]示例：以前提交会提示Enter passphrase for key '/Users/liming/.ssh/id_rsa.liming
2021-07-15 11:12:05
267
原创 【bug】 error in ./node_modules/watchpack/lib/chokidar.js
报错信息：error in ./node_modules/watchpack/lib/chokidar.jsSyntax Error: SyntaxError: /Users/wangji04/Desktop/code/baidu/bjh/fe-react/node_modules/watchpack/lib/chokidar.js: 'return' outside of function (4:1) 2 | try { 3 | module.exports = require(...
2021-05-27 11:02:24
3445
8
原创 node版本降级（mac）
我有一个项目，因为node版本太高，导致npm run dev报错。那么如何降级呢？（1）安装node版本管理模块nsudo npm install n -g下边步骤请根据自己需要选择（2）安装稳定版sudo n stable（3）安装最新版sudo n latest（4） 版本降级/升级sudo n 版本号//例如：sudo n 10.8.0...
2021-05-26 10:53:58
1184
原创 React的生命周期
1. 挂载卸载过程 1.1.constructor() 1.2.componentWillMount() 1.3.componentDidMount() 1.4.componentWillUnmount () 2. 更新过程 2.1. componentWillReceiveProps (nextProps) 2.2.shouldComponentUpdate(nextProps,nextState) 2.3.componentWillUpdate (nextProps,nex
2021-05-22 17:10:26
148
原创 useMemo和useCallback的区别 及使用场景
useMemo和useCallback接收的参数都是一样,第一个参数为回调 第二个参数为要依赖的数据共同作用：1.仅仅依赖数据发生变化, 才会重新计算结果，也就是起到缓存的作用。两者区别：1.useMemo计算结果是return回来的值, 主要用于 缓存计算结果的值 ，应用场景如： 需要 计算的状态2.useCallback计算结果是函数, 主要用于 缓存函数，应用场景如: 需要缓存的函数，因为函数式组件每次任何一个 state 的变化 整个组件 都会被重新刷新，一些函数是...
2021-05-17 14:50:00
2271
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人