Vue中{{}},v-text,v-html的区别

<template>
  <div class="test">
    <p>{{html}}</p>
    <p>{{msg}}</p>
    <p v-text="msg"></p>
    <p v-text="html"></p>
    <p v-html="html"></p>
  </div>
</template>

<script>
import {ref} from 'vue'
export default {
  name : 'Test',
  setup() {
    let msg = ref('你管我')
    let html = ref('<strong>我是谁</strong>')
    return {
      msg,
      html
    }
  }
}
</script>

效果图

image.png

• 总结
  {{}} v-text仅渲染数据，不会解析标签
  v-html不仅渲染数据，还会解析标签