- 博客(9)
- 收藏
- 关注
原创 js中window对象以及其常见属性
innerheight: 返回窗口的文档显示区的高度 innerwidth: 返回窗口的文档显示区的宽度 outerheight: 返回窗口的外部高度 outerwidth: 返回窗口的外部宽度 pageXoffset: 设置或返回当前页面相对于窗口显示区左上角的X位置 pageYoffset: 设置或返回当前页面相对于窗口显示区左上角的Y位置 top:返回最顶层的先辈窗口 screenLeft,screenTop,screenX,screenY:声明了窗口上的左上角在频幕上的x坐标和y坐标.
2021-10-28 15:19:51 1039
原创 react + antd 实现表格的列宽可变,数据量大时页面刷新不卡顿
有需求需要实现表格的列宽拖拉可变,在开始拖拉和放下的过程中在行头显示一条虚线表标明位置,鼠标释放后刷新表格。 上代码! 1. 拖拉传参组件代码 import { FC, useState } from 'react' import { Resizable } from 'react-resizable' // 引入react-resizable npm i xxx 或 yarn add xxx import { deBounce } from '@/utils/utilConvenrt' // 防抖
2021-10-28 09:23:25 1706 2
原创 输入法导致input内容错误
解决输入法的ime模式情况下,decimal添加千分符时额外触发一次onChange事件导致的重复录入问题 【问题原因】:系统自带输入法的中文模式下输入内容后产生逗号(千分符)时,额外触发一次输入事件,导致重复录入问题 【复现必要条件】: 1.输入法:系统自带输入法(搜狗输入法的中文模式就没问题) 2.模式:中文输入模式(英文模式下没问题) 3.浏览器:Chrome(firfox火狐浏览器没问题,其他浏览器不清楚) 【解决方案】分3个方案: 1.设置css的ime-mode: 'disabled',用来禁用
2021-10-28 08:59:38 908 1
原创 Xshell
ls:查询该目录下有哪些文件 cd: 进入所输入的下层文件中 vim /home/conf/buoyancyinfo.conf :查询文件内容 i:进入编辑 wq :保存并退出 docker restart nginx:重启nginx sh: 编译对应文件
2021-10-18 13:34:14 140
原创 浏览器的重绘和回流
第一次打开页面是会至少触发一次重绘和回流,回流(建设):当页面的宽高位置等发生变化时触发reflow回流;重绘(装修):不改变主体宽高位置等时非结构话时触发repaint重绘,背景字体等;如何减少重绘和回流? 1. 将不会修改的样式整体定义在css或less中,在第一次布局的时候尽量完成 2.当样式需要变化时,控制样式整体修改,而非一个个更改 3.绝对布局不会造成大量的reflow 一个页面从输入url到页面加载限时完成的过程发生了:1.浏览器根据请求的url交...
2021-10-12 09:00:18 103
原创 less以及css, react工程中less配置无效果的解决办法
react工程中,less的使用是有必要的 less:具有比css更强大和更加人性化的设计,但在打包过程中都是讲less转化成css 1.允许我们单独定义一系列通用的样式,然后在需要的时候去调用。所以在做全局样式调整的时候我们可能只需要修改几行代码就可以了; 2.混合可以将一个定义好的class A轻松的引入到另一个class B中,从而简单实现class B继承class A中的所有属性。我们还可以带参数地调用,就像使用函数一样。 3.我们可以在一个选择器中嵌套另一个选择器来实现继承,这样很大程度
2021-07-28 15:31:27 1098
原创 在react工程中使用antd组件时,组件显示语言英文切换的方式
antd组件所显示的语言是本工程所采用的默认语言,修改方法为在入口文件src/index.js中引入zhCN,然后在render中使用,如下图 import zhCN from 'antd/es/locale/zh_CN'; ReactDOM.render( <ConfigProvider locale={zhCN}> <App /> </ConfigProvider>, document.getElementById('root') ); .
2021-07-28 15:14:04 1715
原创 craco更改打包后默认打包文件名为dist
React更改配置如果采用eject将react-script拆分不可逆,故推荐使用第三方插件craco来更改一配置,如路径变化等,如需要可参照上一篇文章;而在craco的配置后如需对打包后的文件名进行更改,方式如下。在npm run build 打包命令后,生成的文件夹“build”需更改为“dist” 在craco.config.js文件中,添加如下代码 module.exports = { webpack: { alias: { },...
2021-07-19 15:10:55 3097 2
原创 react 引用路径的简易调整,使用craco插件
在react框架中,为了避免在引用路径中会用到../../,在层级较深的情况下,容易在引用路径时用到大量的.和/的组合,使代码看起来比较凌乱。而将相对路径改变为绝对路径,并用简单的符号代替某一特定层级文件名称,如@代替src,@@代替src/component,@redux代替src/redux......可以更加直观的看到文件的引用位置,无需翻出再翻进来引用文件。 推荐使用方法2或3 1.拆分react-script,暴露配置文件,该过程不可逆 creat...
2021-07-14 10:37:24 2796
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人