vue使用background-image方式使用svg图片

要在Vue中使用SVG图片作为背景图像，可以使用CSS的`background-image`属性。以下是一个例子：

1. 首先，在Vue组件中导入SVG文件：

import mySvg from '@/assets/my-svg.svg';

2. 接下来，在组件的样式中使用`background-image`属性：

.my-element {
  background-image: url(~@/assets/my-svg.svg);
  /* 或者，通过导入SVG文件来使用 */
  /* background-image: url('data:image/svg+xml;base64,' + btoa(mySvg)); */
  /* 注意，这种方法需要使用btoa函数将SVG文件转换为Base64编码 */
}

3. 最后，在组件的模板中使用样式：

<template>
  <div class="my-element"></div>
</template>

<style scoped>
  .my-element {
    width: 100px;
    height: 100px;
  }
</style>

请注意，使用`background-image`属性时，路径应该是相对于CSS文件的。在Vue中，可以使用`~`符号来代表`src`文件夹，因此可以使用`~@/assets/my-svg.svg`路径来引用SVG文件。

另外，如果SVG文件比较小，也可以将它作为Base64编码的数据URI嵌入样式中，如上面的注释所示。