1.案例+图解带你一文读懂SVG 🔥🔥(2.6W+字)
svg是一种图像格式,以一种声明式的语法来绘制图形。 与canvas相比,它可以与css结合使用,与js结合实现动画。文章中作者全面描述了svg的基础用法, 最后提出了一种结合Sketch和GSAP工具库的实用的动画实现方法。
摘录:
再后来就是一次偶然看到了SVG的线条动画,当时真的让我眼前一亮,这也就是我初次结缘于SVG。而随着了解的越多越觉得SVG动画真的是很酷炫,它以独特的方式把线条动画展示的淋漓尽致。
2. 【React】1413- 11 个需要避免的 React 错误用法
// 文中是些react初学者容易踩的坑,仅举一例发散思考。
const count = 0;
const Comp = () => count && <h1>Chris1993</h1>; // 显示0,下面的写法才正确
const count = 0;
const Comp = () => count > 0 && <h1>Chris1993</h1>;
本质是因为&&运算返回值机制,如果前面部分是false则返回false值,而react对于返回false的组件是不作渲染的,也就相当于跳过了。但是在模板字符串中还是会返回false的,同样情形使用三元运算符才可以。示例如下:
`count res ${count>0 && 'count larger than 0'}` // 'count res false'
`count res ${count>0 ? 'count larger than 0' : ''}` // 'count res '
3. 深入浅出富文本编辑器
quill的基本原理,底层是delta线性数据和parchment 与 blot组成的树状数据(对应dom),通过自定义blot可对quill进行二次开发,也可自己解析delta实现多平台的富文本编辑器。 引用一张图:
4.细说Web API中的Blob
-
- Blob是一种二进制数据对象,在对图片等文件进行网络传输,读取与转化时常常用到。
-
- Blob Url是Blob的一种表现形式,目前已支持在地址栏直接打开。通过
URL.createObjectURL(file)可以获取Blob Url对象。
- Blob Url是Blob的一种表现形式,目前已支持在地址栏直接打开。通过
-
- 而File对象是继承于这个对象的,使用FileReader可以方便得读取读取和处理file对象。并将其转化为Base64格式。