- 博客(125)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 win11安装CUDA+cuDNN+ tensorflow
可用的gpu版本tensorflow配置：python3.7.0+CUDA11.6.0+cuDNN8.4.0+tensorflow2.7.0+Keras2.7.0。然后安装tensorflow2.7版本之后（不需要单独安装gpu版本，因为已经包含了），重启电脑，再使用。GTX3060，CUDA driver版本11.7。
2022-10-22 18:07:13
1925
原创 css实现可访问性隐藏的几种方式
可访问性隐藏：在页面上看不到，但是可以被其他辅助设备捕捉，如无障碍识别或者SEO等。众所周知的隐藏方式有设置display、visibility为不可见，但是设置不可见同样会导致屏幕阅读器不可捕捉。因此这种方法并不推荐，以下为几种较好的方式：一、利用clip+absolute（普遍适用）clip属性生效的前提是position为absolute/fixed实现方式： <div style="width: 100px;height: 60px;"> <span
2022-05-14 15:42:18
322
原创 实现BFC的几种方法比较
触发BFC的方式html根元素；float的值不为none；overflow的值为auto、scroll或hidden；display的值为table-cell、table-caption和inline-block中的任何一个；position的值不为relative和static。BFC的特性之一是BFC内部的元素不受外界影响也不影响外界，基于BFC特性 可以实现多栏自适应布局，但是触发BFC的属性自身也有一些奇怪的特性，因此并不是所有的方式都适合自适应布局，以下针对overflow和.
2022-05-10 23:36:36
415
原创 移动网站适配
对于物理像素，设备独立像素，设备像素比，css像素，布局视口，可视视口,理想视口的概念了解参考我对移动端适配的了解移动WEB开发之-流式布局关于移动端适配，你必需要知道的各种视口和js中API的对应关系为：屏幕分辨率：screen.width布局视口：document.documentElement.clientWidth视觉视口：window.innerWidth理想视口：screen.width设备像素比：window.devicePixelRatio屏幕方向：window.or
2022-03-27 22:06:02
424
原创 margin总结
参考张鑫旭——《CSS世界》margin不具有兼容性问题，也就是在各个浏览器下表现一致有滚动条的容器最好使用子元素的margin-bottom取代padding添加底部留白，因为IE和旧版Firefox浏览器是超过padding box触发滚动条，因此其padding-bottom值会在滚动的情况下被忽略。margin实现等高布局（margin负值应用）满足的场景：auto高度的容器内部具有多个水平排列的分栏，且各个分栏的高度始终和容器一致先看效果：代码：//html <di
2022-03-27 17:09:41
485
1
原创 padding+background-clip绘制图形
参考《CSS世界》——张鑫旭background-clip属性用于描述背景绘制的区域，默认为border-box，还可以取值content-box，padding-box效果一：移动端经常使用的折叠菜单图标分析：上下两条使用border-top/bottom实现，中间条利用黑色绘制背景部分。想要背景和border中间有间隙，设置上下padding。默认背景绘制包含padding和border，使用background-clip属性修改背景绘制区域代码：.menu{ w
2022-03-26 11:10:33
236
原创 CSS替换元素和非替换元素
根据是否可以通过修改某个属性值更改元素呈现的内容，可以分为替换元素和非替换元素替换元素以下元素都是可替换元素，以及在各种浏览器下的默认display值（图片来源《CSS世界》——张鑫旭）针对 <input type="button" value="按钮">和<button type="button">按钮</button>，区别在于如果出现很长的文字，前者会直接裁剪溢出文字，而后者会自动换行，如下图所示：设置样式为input[type='button'],b
2022-03-24 22:44:24
803
原创 IntersectionObserver图片懒加载及用户体验优化
前提熟知的图片懒加载的方式是使用getBoundingClientRect函数判断是否在可视区域内，但是调用这个函数会引起回流，影响浏览器性能。可替代的方式是使用IntersectionObserver对象，使用方式参考IntersectionObserver API 使用教程——阮一峰关于回流，参考前端优化总结正题先看效果：模拟图片加载堵塞的情况，图片到达可视区域2s后才加载出图片，在图片加载出来之前鼠标移动到图片上时可显示图片描述文字上代码：//html: <!-- 模
2022-03-24 22:30:10
473
原创 css实现三个点加载中的效果
效果：//html部分：<span class="loading">正在加载中<dot>...</dot> </span>//css： .loading{ display: flex;/*让dot和文字在同一行*/ } dot{ /*让点垂直居中*/ height: 1em; line-height: 1;
2022-03-24 16:16:39
3759
1
原创 关于flex取值0、1、auto、none的区别和场景
由于版权问题，博客地址为flex:0 flex:1 flex:none flex:auto应该在什么场景下使用？
2022-03-15 10:58:48
459
原创 解决antd mobile的长列表ListView不更新视图问题及源码浅析
问题描述：使用antd mobile 的listview 组件展示列表数据，每个列表项除了展示数据还有一个checkbox，整个列表上方有一个控制checkbox是否显示的按钮，当点击“显示”后，checkbox显示出来，此时上滑列表“加载更多”数据，再点击“隐藏”checkbox，此时的checkbox不消失原因：切换按钮状态可以触发render方法，但是由于antd-mobile对性能的优化，并不会每次都触发renderRow方法解决方法：需要重新设置dataSource，并且如果使用的是状态
2022-03-14 18:37:05
1226
原创 antd mobile Datepicker使用moment设置日期后显示NaN
苹果手机只支持按照’/‘划分的日期格式，如’YYYY/MM/DD HH:mm:ss’当然也可以使用原生的Date设置，如设置日期为选中日期的零点：date=>new Date(new Date(date).setHours(0, 0, 0, 0))
2022-03-14 16:03:59
866
原创 外层元素overflow:auto/scroll导致absolute定位的子元素溢出部分被隐藏
1. 问题重现：简易版复现这个问题的代码如下：<div id='wrapper' style="height: 80px;background-color: bisque;width: 400px;overflow-x: auto;display: flex;flex-wrap: nowrap;"> <div class="menu">111 <div style="width: 100%;position: absolute;bot
2022-03-14 15:47:17
9255
2
原创 前端优化总结
了解重排（回流）和重绘浏览器根据HTML文档构建DOM树的同时，用CSS解析器解析CSS文档构建CSSOM树，然后DOM树和CSSOM树共同构成渲染树Render Tree。重绘：当页面中元素样式的改变并不影响它在文档流中的位置时（例如：color、background-color、visibility 等），浏览器会将新样式赋予给元素并重新绘制它，这个过程称为重绘重排：当 Render Tree 中部分或全部元素的尺寸、结构、或某些属性发生改变时，浏览器重新渲染部分或全部文档的过程称为回流。引
2022-02-23 21:27:43
195
原创 es6 Class语法
Class定义的属性和方法都定义在prototype上，除非显式（this）的定义在其本身Class定义的属性和方法都是不可枚举，可以通过Object.getOwnPropetyNames获得，而Object.keys不可Class不存在变量提升，与子类继承有关static定义的静态方法中的this指向类父类的static方法不能被实例继承，但可以被子类继承class中使用#表示私有属性和私有方法私有属性只要在定义该属性的class内部（包括子类），即使是static函数也可以通过类的实例读取.
2022-02-23 16:27:49
477
原创 js数组去重
function unique(arr){ let res=[] for(let i in arr){ if(res.indexOf(arr[i])===-1) res.push(arr[i]) } return res}function unique2(arr){ return Array.from(new Set(arr))}function unique3(arr){ return [...new Set(arr)]}
2022-02-13 11:38:58
295
原创 js多维数组展开为一维数组
function flatten(arr) { let res=[] for(let i in arr){ if(!Array.isArray(arr[i])) res.push(arr[i]) else{ res=res.concat(flatten(arr[i])) } } return res}function flatten2(arr){ return arr.reduce((pre,
2022-02-13 11:26:51
203
原创 js将阿拉伯数字转换为大写中文金额
moneyToCaptital = (money: string) => { //将小数点前后划分开 const dots=money.split('.') const dotFor=dots[0] const dotBehind=dots[1] //小数点前一部分，先反转一下，如'123'变成‘321’ money = dotFor.split('').reverse().join('') const
2022-02-12 17:58:46
837
1
原创 js原型链和类的继承
1. 原型链原型链描述了实例对象和构造函数的关系，每个实例对象obj都包含一个__proto__属性，每个构造函数Class都有一个prototype原型对象，两者的关系是obj.__proto__===Class.prototype，而构造函数的原型和构造函数的关系是Class.prototype.constructor===Classinstanceof就是按照上图，从左侧的__proto__向上查找，从右侧的prototype向下查找判断是否指向同一个终点2. new操作符function
2022-02-11 10:38:47
413
原创 addEventListener第三个参数useCapture
参考博客addEventListener()中的第三个参数参考博客addEventListener()第三个参数useCapture (Boolean)详细解析总结：W3C标准中event触发的顺序：先捕获再冒泡 | | / \-----------------| |--| |-----------------| element1 | | | | || -------------| |--| |---------
2022-02-09 11:06:50
947
原创 阿里云ecs云服务器——tmux部署方式（3）
前面两篇文章阿里云ecs云服务器——Vue项目部署和阿里云ecs云服务器——craco+react项目部署（2）聊了聊相继部署两个前端的过程，这两种方式都是使用nginx反向代理部署的方法，这里聊一种更简单好上手的部署方式——tmuxtmux是终端的命令，详细作用和使用命令见阮一峰老师的Tmux 使用教程使用tmux将项目部署到服务器的过程如下：服务器上安装tmux：sudo apt-get install tmux将自己的项目上传至github或者其他地方在服务器上某个目录下用git clon
2022-01-10 17:48:29
1323
原创 阿里云ecs云服务器——craco+react项目部署（2）
这篇文章是在阿里云ecs云服务器——Vue项目部署（1）的基础上部署另一个React项目的后续注：一般的react项目打包部署过程和这篇文章是一致的。本地打包为了使用less并且不破坏webpack配置（不使用 npm run eject），我使用了craco配置的方式，这样在本地打包的时候需要修改原来的打包命令(react-scripts build）为craco build，否则会导致样式失效问题，修改craco.config.js文件如下（包含了添加less的配置）：const CracoLe
2022-01-10 11:20:01
1718
原创 Windows安装Linux子系统（wsl）
不使用虚拟机在windows下安装Linux的方法：安装Linux命令行：过程参考利用 Windows 子系统 Linux（WSL）开发 Python 环境搭建安装Ubuntu图形桌面：参考wsl安装图形界面——体验有脸有面的图形界面使用命令行安装任何软件的过程如果出现权限不足的问题，可以在apt get之前加上sudo注：安装好的系统自带python3和python2.7的环境，在安装和使用pip的过程需要注意是pip3还是pip...
2021-12-14 23:32:47
1832
原创 阿里云函数计算安装python依赖的几种方法
阿里云函数计算的内存最大是100M，如果函数加依赖的大小不超过100M，可以使用以下前三种方法第一种：使用pip直接安装特点：适用于需要安装的依赖少且小安装方式：在函数根目录下使用命令pip install -t . xxx，意为将依赖安装到项目根目录，没有任何组织结构第二种：使用funcraft安装特点：自动组织依赖结构，安装方式可以用FunFile或者fun install单独安装两种方式安装方式：参考阿里云官方文档 Funcraft如果遇到问题可以参考另一篇文章第三种：使用.
2021-12-14 23:19:26
2181
原创 阿里云函数计算临时保存文件问题
场景：使用阿里云函数计算的过程中需要将某个文件暂时保存，如果自定义保存路径报错No Permission解决办法：不允许随便定义路径，必须使用/tmp/文件夹，且不可在其中定义子文件夹，只能放在/tmp/根目录下。...
2021-11-06 23:32:57
405
原创 阿里云函数计算使用fun安装依赖
查看阿里云官方文档官方的流程大致是：fun install init编写FunFile文件fun install按照这个流程我的项目出现了很多错误，依次解决：一、 No module named "index"报错原因：它的意思是找不到我的云函数的index方法，但事实上我的云函数下是有index方法的，官方template.yml中codeUri为:"./"，但是我的项目这样设置就会报No module named "index"错解决办法：将codeUri直接写到云函数的子目录下，
2021-11-06 23:30:09
642
原创 select组件先已知value，再动态渲染＜option＞列表导致显示问题
select option的value目前只支持string类型，所以需要将option的value修改为string类型才能正确显示文本
2021-10-10 16:07:41
323
转载 antd treeselect组件搜索配置
转载自博客 有时候我们需要在TreeSelect中添加搜索功能，Antd是有提供对应的配置选项，两步即能实现： 1、在a-tree-select标签中添加show-search参数，这能在下拉中显示搜索框，需要注意的是仅在单选模式下生效； 2、在a-tree-select标签中添加tree-node-filter-prop参数，其值为tree-data参数绑定的数组（图中接口返回的整个data
2021-10-10 12:08:44
1539
转载 关于antd-mobile的Tabs标签设置page或者initialPage后无法点击的问题
转载自博客 估计这是Tabs组件的一个bug吧 做H5项目时，阿里的UI组件库比较多，一直用的很愉快，感谢阿里！ Ant Design Mobile组件库 不过，今天在使用tabs组件时，发现了一个bug，一个好的bug，总是让你欲仙欲死，特地记录下来让大家高兴一下。 如下图所示，目前有3个tab页。 项目首页地址为：http://xxx?wantTabNum=2，访问首页时，默认打开的是第一个tab，但是如果链接中wan
2021-09-22 15:59:27
990
原创 antd TreeSelect组件显示value而非title问题
首先，保证在给TreeSelect的value赋值时treeData中必须已经包含了该value值还需要注意，value必须是string类型，如果使用number类型的value则会出现这个问题
2021-07-31 17:39:15
1440
原创 浏览器的各种宽高
宽高相关的属性（即带有Width/Height，如offsetHeight）：client是不包括边缘（滚动轴）的宽高，offset包括边缘，scroll是包含所有滚动区域的整个正文文档的宽高参见博客距离相关的属性（即带有Top/Left，如offsetTop）：offset是相对于父元素的距离参见博客...
2021-07-26 11:46:22
340
原创 解决react项目启动invalid host header问题
问题描述：react create app项目在本地（localhost或127.0.0.1）环境中可以正常访问，但是部署到服务器后，可以用公网IP但不能用域名访问解决办法：第一种：项目根目录新建.env.development.local文件，文件中写入：DANGEROUSLY_DISABLE_HOST_CHECK=true需要注意git默认忽略该文件，需要在.gitignore文件中将该文件注释掉才能上传到github上第二种：npm run eject暴露webpa.
2021-06-16 11:03:53
2456
原创 vscode配置bash终端作为默认终端
首先参考博客，旧的vscode可以配置成功，但是下载的新版的vscode没有这个shell.windows配置项，采用以下方法解决参考vscode官方文档，文档中有一段是Profiles can be created using either a path or a source, as well as aset of optional arguments. A source is available only on Windows andcan be used to let VS Code de
2021-05-09 10:18:32
3523
3
原创 视图封装
1. 视图封装模式有哪几种借用angular对三种视图模式的解释：ShadowDom 模式使用浏览器原生的 Shadow DOM 实现（参阅 MDN）来为组件的宿主元素附- 加一个 Shadow DOM。组件的视图被附加到这个 Shadow DOM 中，组件的样式也被包含在这个 Shadow DOM 中。(译注：不进不出，没有样式能进来，组件样式出不去。)Emulated 模式通过预处理（并改名）CSS 代码来模拟 Shadow DOM 的行为，以达到把 CSS 样式局限在组件视图中的目的。(
2021-04-02 16:47:28
218
原创 使用ssh登录服务器（密码和私钥）
使用密码客户端命令行输入ssh root@公网ip，然后输入密码即可使用公钥私钥客户端：ssh-keygen -t rsa -b 4096或者ssh-keygen -t rsa -C "注释" -b 4096 参考如下，下图转载自博客以上参数详细解释参考博客上传公钥到服务器在客户端输入L➜ ~ ssh-copy-id -i 客户端上公钥位置 root@公网IP出现上图即表示已经添加成功，可以通过ssh root@公网ip -i 客户端私钥位置测试是否成功连接完成以上步骤则已经可以通过s
2021-01-25 19:08:36
4016
计算机图形学_CSDN.zip
2019-12-07
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人