Iconify for React 函数:iconLoaded
本教程属于 Iconify for React 函数教程 的一部分。
函数 iconLoaded() 检查图标数据是否可用于渲染。
用法
该函数包含以下参数:
- name,string。图标名称。
该函数返回 boolean 值:如果图标数据可用,则返回 true;如果图标数据不可用,则返回 false。
示例
jsx
import { iconLoaded, loadIcons, Icon } from "@iconify/react";
function renderLeftArrow() {
// 检查 'bi:arrow-left' 是否可用
if (iconLoaded("bi:arrow-left")) {
// 返回 'bi:arrow-left' 的 HTML
return <Icon icon="bi:arrow-left" />;
}
// 加载图标。这是一个不好的示例,因为在有状态组件中本应使用回调来重新渲染箭头,
// 但此代码示例旨在演示 iconLoaded(),而非 loadIcons()
// loadIcons() 函数是异步的,因此在此示例中它仅会触发加载操作,但
// 图标数据不会立即可用
loadIcons(["bi:arrow-left"]);
// 返回 '<'
return <span><</span>;
}旧版
注意:在组件的旧版本中,此函数名为 iconExists()。它是同一个函数,只是命名不当。
由于命名不当,部分开发者误以为该函数会检查图标是否存在于 Iconify API 中。事实并非如此。它所做的仅仅是检查组件的存储。
为避免混淆,该函数已被重命名。