Vuejs + Vuetify在svg圈子中包含图片

Question

我实际上是想弄清楚如何使用Vuetify进行下图所示的操作。

所以我尝试了一堆东西，但是没有一个。这是我的最后尝试：

<v-flex
  xs12
  sm4
  md4
  align-center
  justify-center
  text-xs-center>
  <svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" class="dotted-circle">
    <circle cx="150" cy="150" r="75">
      <v-img
        :src="profilePic"
        aspect-ratio="1"
        max-height="100"
        max-width="100"
        class="grey lighten-2 rounded-img">
      </v-img>
    </circle>
  </svg>
</v-flex>

但这只是向我显示了我的虚线圆，并且我的图像似乎隐藏在它的后面。结果如下：

还有html结果：

我不知道我在做什么错。