下面是一个简单的解决方案，文本被解析为文本节点和变量节点，然后你可以打印文本节点，并对变量节点做任何你想做的事情：

const text = `Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the $Year an unknown printer took a galley of type and scrambled it to make a type specimen book $SomeName}. It has survived not only five centuries, but also the eap into electronic typesetting, remaining essentially unchanged.`

const parseText = (text) => {
  const parts = []
  while (text) {
    const nextVarIx = text.search(/\$\w+/)
    if (nextVarIx === -1) {
      parts.push({
        text
      })
      break
    }
    if (nextVarIx > 0) {
      parts.push({
        text: text.substring(0, nextVarIx)
      })
      text = text.substring(nextVarIx)
    }
    const varEnd = 1 + text.search(/\w\b/)
    const variable = text.substring(0, varEnd)
    parts.push({
      variable,
      value: '<Click to change>'
    })
    text = text.substring(varEnd)
  }
  return parts
}

new Vue({
  el: '#app',
  methods: {
    fill(variable) {
      variable.value = (Math.random() + 1).toString(36).substring(7)
    },
  },
  data() {
    return {
      textData: parseText(text),

    };
  },
})

.text-variable {
  font-weight: bold;
}
.text-variable:hover {
  cursor: pointer;
}

<div id="app">
  <div>
    <template v-for="(part, index) in textData" :key="index">
      <span v-if="part.variable" class="text-variable" @click="fill(part)">
        {{ part.value }}
      </span>
      <span v-else>{{ part.text }}</span>
    </template>
  </div>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.7.10/vue.min.js"></script>
<script src="https://unpkg.com/v-calendar"></script>