Question

我试图在vue2中将组件称为背景图像。

我使用的是vue-feather-icons-ssr，我可以称之为：

<icon name="feather"></icon>

它将图标呈现为SVG。

现在我想在background-image中渲染这个组件，但实际上我的所有方法都不起作用。

示例我希望它如何工作（伪代码）：

<div :style="{background-image: url(<icon name="feather"></icon>)}">test</div>

Answer 1

您需要直接访问图标的SVG，而不是通过组件访问。假设您使用webpack和npm，并且您的图标库包含SVG数据（即它没有将图像包装在JS文件中，例如vue-awesome会这样做）：您可以将SVG文件的相对路径写入风格，在这种情况下你不必绑定它（style而不是:style）。