用vue写两个span之间用水平虚线连接

你可以使用CSS样式和Vue的模板语法来实现两个`<span>`之间的水平虚线连接。以下是一个示例代码：

<template>
  <div>
    <span class="dashed-line"></span>
    <span>连接的内容</span>
    <span class="dashed-line"></span>
  </div>
</template>

<style>
.dashed-line {
  border-top: 1px dashed #000;
  display: inline-block;
  width: 50px; /* 设置虚线的长度 */
  height: 0; /* 设置虚线的高度 */
  margin: 0 10px; /* 设置虚线与内容之间的间距 */
}
</style>

在上面的代码中，我们在两个`<span>`标签之间插入了一个空的`<span>`标签，并为其添加了一个名为`dashed-line`的类。通过CSS样式，我们设置了该类的样式为一条1像素宽的虚线，并设置了虚线的长度、高度以及与内容之间的间距。

这样，你就可以在Vue中用水平虚线连接两个`<span>`元素了。