组件实战-Icon图标组件
学习目标
- 理解并掌握 组件实战-Icon图标组件 的核心原理与工程实践
总结
这节我们实现了 Icon 组件。
支持 size、spin、className、style 等参数。
然后实现了 createIcon 方法,可以传入 svg 内容来生成具体的 Icon。
并且对 iconfont 做了支持,实现了 createIconFromIconfont,可以传入 scriptUrl,然后指定 type 来引用对应的 icon。
通过把 svg 的 fill 设置为 currentColor,把 width、height 设置为 1em, 实现了可以通过 color 和 font-size 来设置 Icon 大小和颜色的效果。
这就是我们每天在用的 Icon 组件的实现原理。