LightRain
获得徽章 1
赞了这篇文章
#青训营笔记创作活动#
1月24日 day9
今日学习TS注释规范标准：TSDoc
TS代码注释解析器：TS代码注释解析器
API信息提取器：api-extractor
文档生成器：api-documenter
站点生成器：Vuepress、Hexo、Hugo
1月24日 day9
今日学习TS注释规范标准：TSDoc
TS代码注释解析器：TS代码注释解析器
API信息提取器：api-extractor
文档生成器：api-documenter
站点生成器：Vuepress、Hexo、Hugo
展开
评论
点赞
#青训营笔记创作活动#
1月23日 day8
今日学习CSS 可以完全取代 JS的场景
①颜色选择器：直接通过设置 input 标签属性，type='color'实现
②打字效果：通过CSS动画效果@-webkit-keyframes的typing和blink-caret实现
③滑顶/触底效果：在html代码中使用a标签的href引用id而跳转到对应id的位置，css代码使用 scroll-behavior: smooth; 属性。
④顺滑切图：CSS scroll-snap-type: x（或者 y） mandatory; 可以让你顺滑切图。当你滑动横向滚动条到一定位置时，会自动为你切图，这样显得流畅；
1月23日 day8
今日学习CSS 可以完全取代 JS的场景
①颜色选择器：直接通过设置 input 标签属性，type='color'实现
②打字效果：通过CSS动画效果@-webkit-keyframes的typing和blink-caret实现
③滑顶/触底效果：在html代码中使用a标签的href引用id而跳转到对应id的位置，css代码使用 scroll-behavior: smooth; 属性。
④顺滑切图：CSS scroll-snap-type: x（或者 y） mandatory; 可以让你顺滑切图。当你滑动横向滚动条到一定位置时，会自动为你切图，这样显得流畅；
展开
评论
点赞
#青训营笔记创作活动#
1月22日 day7
今日学习：将常规树状结构扁平化有利于数据处理
优点：
结构很清晰，我们可以很轻易的对数据进行处理。
海量数据情况下，极大地提高性能，减去需要遍历的性能消耗。
1月22日 day7
今日学习：将常规树状结构扁平化有利于数据处理
优点：
结构很清晰，我们可以很轻易的对数据进行处理。
海量数据情况下，极大地提高性能，减去需要遍历的性能消耗。
展开
评论
点赞
#青训营笔记创作活动#
今日学习：通过第三方库来实现文档预览功能，并将其封装成preview组件
docx：npm i docx-preview
PDF：npm i pdfjs-dist
今日学习：通过第三方库来实现文档预览功能，并将其封装成preview组件
docx：npm i docx-preview
PDF：npm i pdfjs-dist
评论
点赞
#青训营笔记创作活动#
1月20日 day5
今日学习：利用HTML和CSS（主要）实现一个探照灯风的 404 页面
处理动画：使用cubic-bezier 方法，来定义贝塞尔曲线的
灯罩：通过不同的 border-radius实现
灯泡：一个半圆加一部分阴影
追光：通过边框线实现
文字：通过定位居中之后，刚好显示在灯光动画效果范围之内
文字颜色和背景色一致之后，通过灯光的透明度效果控制文字显隐
1月20日 day5
今日学习：利用HTML和CSS（主要）实现一个探照灯风的 404 页面
处理动画：使用cubic-bezier 方法，来定义贝塞尔曲线的
灯罩：通过不同的 border-radius实现
灯泡：一个半圆加一部分阴影
追光：通过边框线实现
文字：通过定位居中之后，刚好显示在灯光动画效果范围之内
文字颜色和背景色一致之后，通过灯光的透明度效果控制文字显隐
展开
评论
点赞
#青训营笔记创作活动#
2023/1/19 Day4
学习内容：前端工程化开发、规范、测试、lint、构建、部署、监控、集成、微服务等等链路
前端的4 个现代化:模块化、组件化、规范化、自动化 以及
组件库的4个工程化：开发、集成、测试、发布
2023/1/19 Day4
学习内容：前端工程化开发、规范、测试、lint、构建、部署、监控、集成、微服务等等链路
前端的4 个现代化:模块化、组件化、规范化、自动化 以及
组件库的4个工程化：开发、集成、测试、发布
展开
评论
点赞
#青训营笔记创作活动#
2023年1月18日 Day3
学习内容：
使用 background-clip 实现、使用 mix-blend-mode 实现、结合滚动实现动画的方法实现苹果官网滚动文字特效
2023年1月18日 Day3
学习内容：
使用 background-clip 实现、使用 mix-blend-mode 实现、结合滚动实现动画的方法实现苹果官网滚动文字特效
展开
评论
点赞
#第五届青训营阅读打卡#
今日学习 index不能作为key的部分场景
key是vue中虚拟dom标记的唯一标识，通过这个key，diff算法能更加准确和快捷，但是对于可变列表：
使用index作为key，会导致diff中的优化失效（降低了复用性，违背了虚拟DOM的初衷）
使用index作为key时，在删除数据时，因为vue不会深入地区对比子组件的文本内容，所以会错误移除VDOM中的节点（index的值是不固定的)
今日学习 index不能作为key的部分场景
key是vue中虚拟dom标记的唯一标识，通过这个key，diff算法能更加准确和快捷，但是对于可变列表：
使用index作为key，会导致diff中的优化失效（降低了复用性，违背了虚拟DOM的初衷）
使用index作为key时，在删除数据时，因为vue不会深入地区对比子组件的文本内容，所以会错误移除VDOM中的节点（index的值是不固定的)
展开
评论
点赞