摘要: 在实现图像与文本内容对齐时,我们面临着垂直对齐和环绕效果之间的挑战。 ### 期望实现效果: ### 实际: 1. 用 `float` + `flex`、`grid` 处理垂直对齐。 对齐了,但是当文本内容较多高度比图像高度高时,空间效率低,没有环绕效果。 2. 用 `float` + [shape 阅读全文
posted @ 2023-07-24 10:02 ESnail 阅读(24) 评论(0) 推荐(0) 编辑
摘要: Storybook 刚刚达到了一个重要的里程牌:7.0 版本!为了庆祝,该团队举办了他们的第一次用户大会 - [Storybook Day](https://storybook.js.org/day)。为了更特别,在活动页面中添加了一个视觉上令人惊叹的 3D 插图。 原文:[How we built 阅读全文
posted @ 2023-06-05 09:43 ESnail 阅读(286) 评论(0) 推荐(2) 编辑
摘要: 参考:[Building a WebGL Carousel with React Three Fiber and GSAP](https://tympanus.net/codrops/2023/04/27/building-a-webgl-carousel-with-react-three-fibe 阅读全文
posted @ 2023-05-22 09:34 ESnail 阅读(251) 评论(0) 推荐(0) 编辑
摘要: 1、深拷贝 1.1、概念 对象的深拷贝是指其属性与其拷贝的源对象的属性不共享相同的引用(指向相同的底层值)的副本。 因此,当你更改源或副本时,可以确保不会导致其他对象也发生更改;也就是说,你不会无意中对源或副本造成意料之外的更改。 在深拷贝中,源和副本是完全独立的。深拷贝与其源对象不共享引用,所以对 阅读全文
posted @ 2023-05-11 09:53 ESnail 阅读(334) 评论(0) 推荐(1) 编辑
摘要: 手边的项目中有个函数,主要实现图片分片裁剪功能。可以优化一下。 也想看看 chatGPT 的代码理解能力,优化能力,实现能力,用例能力。 于是有了这篇文章。 实验结果总结: chatGPT 确实强大,提供的答案可以借鉴,但不能完全依赖,需要你自行判断是否正确 当你需要一个纯函数时,可以考虑使用。 提 阅读全文
posted @ 2023-04-13 09:37 ESnail 阅读(597) 评论(0) 推荐(2) 编辑
摘要: 新项目用 umi4-max 搭建,部分功能想要使用其他项目的功能,不想重新开发,想到了使用 webpack5 的联邦模块,可以直接引用其他项目代码来实现共享代码。 理想很美好,现实很残酷。直接按照 webpack5 联邦模块的使用方法,并不能成功,而官方文档没有明确说明如何使用。 webpack 联 阅读全文
posted @ 2023-03-19 21:09 ESnail 阅读(808) 评论(0) 推荐(0) 编辑
摘要: 1. 效果展示 在线查看 2. 开始前说明 效果实现参考源码:Logo 聚集与散开 原效果代码基于 react jsx 类组件实现。依赖旧,代码冗余。 我将基于此进行重构,重构目标: 基于最新依赖包,用 ts + hook 实现效果 简化 dom 结构及样式 支持响应式 重构应该在还原的基础上,用更 阅读全文
posted @ 2023-03-16 09:38 ESnail 阅读(281) 评论(0) 推荐(0) 编辑
摘要: 收录一下,方便需要的时候查询。 参考:TS进阶之infer 主要内容:介绍下非常实用的infer的使用方法 使用介绍 条件类型的基本语法是: T extends U ? X : Y; 如果占位符类型 U 是一个可以被分解成几个部分的类型,譬如数组类型,元组类型,函数类型,字符串字面量类型等。这时候可 阅读全文
posted @ 2022-11-16 11:55 ESnail 阅读(122) 评论(0) 推荐(0) 编辑
摘要: 美化字体,镂空字是个不错的选择。 参考:中秋佳节之际, 一起来欣赏 9 个冷门的css属性 镂空字 p { font-size: 150px; color: white; -webkit-text-stroke: 6px red; } 字体白色,描边红色。 渐变色镂空文字 p { font-size 阅读全文
posted @ 2022-09-16 18:13 ESnail 阅读(1314) 评论(0) 推荐(0) 编辑
摘要: 问题 已知:from ,to 两点的坐标,如何求两点连线的旋转角度? 可以通过余弦定理求解三个角的度数。具体说明如下: 在三角形中,已知边A、B、C, 且A、B、C所对的内角分别是a、b、c, 则: cosa=[B²+C²-A²]/(2BC) cosb=[A²+C²-B²]/(2AC) cosc=[ 阅读全文
posted @ 2022-07-09 20:25 ESnail 阅读(2071) 评论(0) 推荐(0) 编辑