vue指令 v-text和v-html

最新推荐文章于 2023-06-10 08:25:49 发布

玉安_ZhangDe

最新推荐文章于 2023-06-10 08:25:49 发布

阅读量687

点赞数

分类专栏： Vue.JS 文章标签： vue.js html 前端

本文链接：https://blog.csdn.net/qq_47373340/article/details/125607546

版权

Vue.JS 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

目的: 更新DOM对象的innerText/innerHTML

语法:
- v-text="vue数据变量"
- v-html="vue数据变量"
注意: 会覆盖插值表达式

<template>
  <div>
    <p v-text="str"></p>
    <p v-html="str">{{ 10 + 20 }}</p>
    <!-- 注意: v-text或v-html会覆盖插值表达式 -->
  </div>
</template>

<script>
export default {
  data(){
    return {
      str: "<span>我是一个span</span>"
    }
  }
}
</script>

<style>

</style>