Vue中使用差值表达式{{}} , 差值闪烁问题

最新推荐文章于 2024-09-26 23:40:19 发布

兮赫

最新推荐文章于 2024-09-26 23:40:19 发布

阅读量902

点赞数 1

文章标签： js vue

本文链接：https://blog.csdn.net/weixin_44356673/article/details/107224655

版权

精选30+云产品，助力企业轻松上云！>>>

举例:

<template>
  <div>
      <h1>{{ name.substring(1) }} 非常帅</h1>
      <h1>有{{ num*2 }}位 {{ hhh }} 为{{ name }}着迷</h1>
  </div>
</template>

<script>
export default {
  data() {
    return {
      name:'赫哥',
      num:1,
      hhh:'女神'
    }
  },
}
</script>

<style>

</style>

在网速慢的情况下，就会出现代码。

可用谷歌进行可以改变网速,查看问题:

解决方法：使用v-test or v-html标签

<template>
  <div>
      <h1 v-test="name.substring(1)"> 非常帅</h1>
      <div  v-html="hhh"> </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      name:'赫哥',
      hhh:'<h1>有2位女神为赫哥着迷</h1>'
    }
  },
}
</script>

<style>

</style>