前言
在前端开发中，使用 icon 图标是非常普遍的需求，其中 Material Design Icons（MDI）是一个非常受欢迎的 icon 图标库，它提供了大量的图标符号，向开发者提供了很大的方便。
在本文中，我将介绍一个非常好用的库——"@lokua/mdi-svg"，它提供了一个简单的方式来加载 Material Design Icons 的 SVG 图标。
安装
你可以使用 npm 或是 yarn 来安装 "@lokua/mdi-svg"，如下：
- -- --- -- --- ------- -------------- - -- ---- -- ---- --- --------------
使用
"@lokua/mdi-svg" 的 API 很简单，它只提供了一个函数来加载 SVG 图标。
语法
------------- ------- ----- -------- --------------------
其中：
- icon: string，必选，需要加载的 icon 名称。
- size: string，可选，icon 大小。
返回
返回一个 Promise 对象，解析为 SVGAElement，SVG 图标的 DOM 元素。
示例
在下面的代码中，我们首先引入 "@lokua/mdi-svg"：
------ - ------- - ---- ----------------
然后，我们可以调用 loadSvg 函数来异步加载图标 SVG 文件，并将其插入到文档中：
-- ------
--------------- -------
--------- -- -
------------------------------
--在这个例子中，我们使用 loadSvg 函数来异步加载名为 "menu" 的 icon 图标，并将其大小设置为24像素，最后将其插入到文档中。
结语
"@lokua/mdi-svg" 是一个非常好用的库，它可以帮助你非常容易地加载 Material Design Icons 的 SVG 图标，并在页面中使用它们。
希望本文能对你有所帮助，如果您对此有任何疑问或建议，请在下面留言。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60066bc8967216659e2445f6