Vue—内置指令

目录

v-text

v-html

v-show

v-if

v-else

v-else-if

v-for

v-on

v-bind

v-model

v-slot

v-pre

v-once

v-memo

v-cloak

---

v-text

更新元素的文本内容。

• 期望的绑定值类型：string

• 详细信息

  v-text 通过设置元素的textContent 属性来工作，因此它将覆盖元素中所有现有的内容。如果你需要更新 textContent 的部分，应该使用mustache interpolations代替。

• 示例

   

  
  
  {{msg}}
  

v-html

更新元素的 innerHTML。

• 期望的绑定值类型：string

• 详细信息

v-html 的内容直接作为普通 HTML 插入—— Vue 模板语法是不会被解析的。如果你发现自己正打算用 v-html 来编写模板，不如重新想想怎么使用组件来代替。

安全说明

在你的站点上动态渲染任意的 HTML 是非常危险的，因为它很容易导致 XSS攻击。请只对可信内容使用 HTML 插值，绝不要将用户提供的内容作为插值

在单文件组件，scoped 样式将不会作用于 v-html 里的内容，因为 HTML 内容不会被 Vue 的模板编译器解析。如果你想让 v-html 的内容也支持 scoped CSS，你可以使用 CSS Modules或使用一个额外的全局