在blazor页面中使用SVGS

Question

我有一个剃须刀组件，我想向其中添加一个SVG。

最好为每个SVG创建一个组件，以便我可以轻松地重用它，还是将SVG包含在blazor页面中会更好？

这些只是我认为可以完成的两种方法，什么是最好的解决方法以及如何实现？

没有找到任何资源，所以我什么也不能尝试。

Answer 1

我尝试过，据我所知Blazor Component模型与Svg完美配合：

SvgHolder.razor

<svg width="100" height="100">
   @ChildContent
</svg>

@code {
    [Parameter]
    public RenderFragment ChildContent { get; set; }

}

SvgSample.razor

<circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />

@code {

}

TestPage.razor

<SvgHolder >
    <SvgSample />
</SvgHolder>

Answer 2

一种发现的方法：

在wwwroot中添加文件：

然后将其添加到HTML页面：

<img src="Images/scissors.svg" />