v-text和v-html的区别
2024-10-06 11:43:00
一、v-text
用于渲染普通文本,无论何时,绑定的数据对象上 msg
属性发生了改变,插值处的内容都会更新。
<span v-text="message"></span>
<!-- 简写方式 -->
<span>{{message}}</span>
export default {
data () {
return {
message: "这里可以包含html标签"
}
}
}
二、v-html
如果你想输出真正的 HTML,你需要使用 v-html
指令,v-text仅渲染标签,不能解析 HTML 代码。
<p v-text=“message”></p>
<p v-html="message"></p>
<script type="text/javascript">
var app = new Vue({
el: '#app', //element
data: {
message: '<strong>Hello</strong> Vue!',
}
})
</script>
v-text展示效果: <strong>Hello</strong> Vue!
v-html展示效果: Hello Vue!
总结:v-text和{{}}表达式渲染数据,不解析标签。
v-html不仅可以渲染数据,而且可以解析标签。
最新文章
- C#,int转成string,string转成int
- Servlet接口五种方法介绍
- python pip源
- Oracle监听小问题
- css-css权威指南学习笔记2
- IEnumerable接口
- Flink - FlinkKafkaConsumer08
- Generic method return type
- SPL标准库常用的数据结构
- 【转】Maven实战(七)---传递依赖
- POJ 2763 Housewife Wind (树链剖分 有修改单边权)
- Gen_server行为分析与实践
- xilinx cpld XC95144XL 最小系统板
- python进行base64编解码
- iOS 判断设备是否越狱
- js 常用方法记事本
- testlink于smarty配置和使用
- java 集合中将元素倒序排列
- React翻译官网文档之JSX
- 基于Django的python验证码
热门文章
- C++string,char* 字符数组,int类型之间的转换
- 证书pfx转jks
- 【HDU5409】CRB and Graph 边双联通 子树最值
- D-Big Integer_2019牛客暑期多校训练营(第三场)
- CodeForces 283C World Eater Brothers
- codeforces 813 D. Two Melodies(dp)
- Atcoder D - Black and White Tree(树dp+博弈)
- SSH项目,JSP项目,SSM项目源码附带环境安装指导视频教程
- 什么是Werkzeug
- Day002_LInux基础_常用命令