图标 Svelte 组件
图标 Svelte 组件表示图标元素。它可以与自定义图标、Framework7 图标 和 Material 图标 一起使用。
图标组件
以下组件包含其中
图标
图标属性
| 属性 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| 尺寸 | 数字 字符串 | 图标尺寸，单位为像素 | |
| 图标 | 字符串 | 自定义图标类 | |
| f7 | 字符串 | F7 图标字体图标的名称 | |
| 材料 | 字符串 | Material 图标字体图标的名称 | |
| iOS | 字符串 | 在使用 iOS 主题时要使用的图标。包含由冒号分隔的图标族和图标名称，例如 f7:house | |
| md | 字符串 | 在使用 Material 主题时要使用的图标。包含由冒号分隔的图标族和图标名称，例如 material:home | |
| 工具提示 | 字符串 | 图标 工具提示 文本，在鼠标悬停/按下图标时显示 | |
| 工具提示触发器 | 字符串 | 悬停 | 定义如何触发（打开）工具提示。可以是 hover、click 或 manual |
示例
<!-- Default back icon -->
<Icon icon="icon-back" />
<!-- Some custom icon -->
<Icon icon="icon-home" />
<!-- F7 Icons font icon -->
<Icon f7="house" />
<!-- Material Icons font icon -->
<Icon material="home" />
<!-- F7 icons font icon with custom size and color -->
<Icon f7="house" size="44px" color="blue" />
<!-- Conditional icon -->
<Icon ios="f7:house" md="material:home" />