梗概:

在标签的innerText中使用两个大括号将变量围起来

实例:

<div id="counter">
  Counter: {{ counter }}<!--用两个大括号-->
</div>
const Counter = {
  data() {
    return {
      counter: 0
    }
  }
}
Vue.createApp(Counter).mount('#counter')

1. 说明:

  1. child::Vue 将数据挂载到指定dom标签中
  2. 还可以通过添加v-once命令, 当数据改变时,插值处的内容不会更新。
  3. 双大括号会将数据解释为普通文本,而非 HTML 代码。为了输出真正的 HTML,你需要使用v-html 指令
  4. child::Vue 插值中使用js表达式