来自 Internet 的自定义 Ionic 图标
Custom Ionic icon from Internet
我想像这样动态地使用离子图标:
<ion-icon src="https://eu.ui-avatars.com/api/?background=0D8ABC&color=fff"></ion-icon>
知道如何进行这项工作吗? (如果可能的话)
ion-icon
组件只接受具有 src='/path/to/file.svg'
属性的有效 .svg
文件。正如 Ionicon documentation.
所述
Custom icons
To use a custom SVG, provide its url in the src attribute to request the external SVG file. The src attribute works the same as in that the url must be accessible from the webpage that's making a request for the image. Additionally, the external file can only be a valid svg and does not allow scripts or events within the svg element.
<ion-icon src="/path/to/external/file.svg"></ion-icon>
您的 src
属性中的图像是 .png
格式,而不是组件期望的 .svg
格式。这将导致组件不呈现图标。如果您改用 .svg
,结果会如您所愿。
我想像这样动态地使用离子图标:
<ion-icon src="https://eu.ui-avatars.com/api/?background=0D8ABC&color=fff"></ion-icon>
知道如何进行这项工作吗? (如果可能的话)
ion-icon
组件只接受具有 src='/path/to/file.svg'
属性的有效 .svg
文件。正如 Ionicon documentation.
Custom icons To use a custom SVG, provide its url in the src attribute to request the external SVG file. The src attribute works the same as in that the url must be accessible from the webpage that's making a request for the image. Additionally, the external file can only be a valid svg and does not allow scripts or events within the svg element.
<ion-icon src="/path/to/external/file.svg"></ion-icon>
您的 src
属性中的图像是 .png
格式,而不是组件期望的 .svg
格式。这将导致组件不呈现图标。如果您改用 .svg
,结果会如您所愿。