vue指令之.v-text和v-html

145 阅读1分钟

掌握v-text和v-html的使用.

用途:更新DOM对象的innerText/innreHTML.

语法

  • v-text = "vue数据变量"
  • v-html = "vue数据变量" 示例
<template>
  <div>
    <h2>v-text v-html</h2>
    <p v-text="str"></p>
    <p v-html="str"></p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      str: "<i>有手就行</i>",
    };
  },
};
</script>

小节

  • v-text 把值当成普通字符串显示
  • v-html把值当作html解析.