Vue-Vue文本渲染三种方法 {{}}、v-html、v-text
{{ }}
将元素当成纯文本输出
v-html
v-html会将元素当成HTML标签解析后输出
v-text
v-text会将元素当成纯文本输出
代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue文本渲染三种方法</title>
</head>
<body>
<div id="app">
<!-- {}}/v-text不能解析html元素，只会照样输出 -->
<p>{{hello}}</p>
<p v-text = 'hello'></p>
<p v-html = 'hello'></p>
</div>
</body>
<script src="vue.js"></script>
<script>
new Vue({
el:'#app',
data:{
hello:'<span>hello world</span>'
}
})
</script>
</html>
运行结果：
Vue-Vue文本渲染三种方法 {{}}、v-html、v-text的更多相关文章
- EditControl 限制输入文本的三种方法
下边是三种限制编辑框输入内容的方法.在VS里建立基于对话框的应用程序CMyEdit,打开资源视图,删除对话框上自带的确定和取消按钮.然后添加一编辑框控件,将其ID修改为IDC_MY_EDIT,通过类向 ...
- Vue全局组件创建三种方法
<my-com1></my-com1> <my-com2></my-com2> <template id="tmp1"> ...
- vue后台管理项目中菜单栏切换的三种方法
第一种方法:vue嵌套路由(二) <el-menu :default-active="defaultActive" style="min-height: 100%; ...
- vue自定义指令，比onerror更优雅的方式实现当图片加载失败时使用默认图，提供三种方法
首先,来看下效果图(演示一下图片正常加载与加载失败时的效果) 在线体验地址:https://hxkj.vip/demo/vueImgOnerror/ 一.常规方法解决 我们都知道,img标签支持one ...
- vue中组件的四种方法总结
希望对大家有用 全局组件的第一种写法 html: <div id = "app"> <show></show></div> js: ...
- 黑马vue---56-58、vue组件创建的三种方式
黑马vue---56-58.vue组件创建的三种方式 一.总结 一句话总结: 不论是哪种方式创建出来的组件,组件的 template 属性指向的模板内容,必须有且只能有唯一的一个根元素 1.使用 Vu ...
- 服务器文档下载zip格式 SQL Server SQL分页查询 C#过滤html标签 EF 延时加载与死锁 在JS方法中返回多个值的三种方法（转载） IEnumerable,ICollection,IList接口问题 不吹不擂，你想要的Python面试都在这里了【315+道题】 基于mvc三层架构和ajax技术实现最简单的文件上传 事件管理
服务器文档下载zip格式 刚好这次项目中遇到了这个东西,就来弄一下,挺简单的,但是前台调用的时候弄错了,浪费了大半天的时间,本人也是菜鸟一枚.开始吧.(MVC的) @using Rattan.Co ...
- 三种方法教你HTML实现点击某一个元素之外触发事件
HTML实现点击某一个元素之外触发事件 大致编写的HTML界面渲染后是这个样子的,我们现在想要实现的需求是点击Button所在的div不会触发事件,而在点击Button所在的div之外的区域时会触发事 ...
- Linux 添加开机启动项的三种方法
linux 添加开机启动项的三种方法. (1)编辑文件 /etc/rc.local 输入命令:vim /etc/rc.local 将出现类似如下的文本片段: #!/bin/sh## This scri ...
随机推荐
- TurboLinux系统管理习题一
TurboLinux系统管理习题一 1. 使用vi编辑文本只读时,强制存盘并退出的命令是?(单选题)A :w! B :q! C :wq! D :e!答案 ...
- 【转】巧用DOS tree命令+批处理 实现 指定文件 批量复制！
转自:http://www.cnblogs.com/looky/archive/2010/01/24/1655292.html 今天一朋友叫我帮忙解决指定文件批量复制的问题,于是找了一大堆批处理命令, ...
- Linux 磁盘分区方案简析
Linux 磁盘分区方案简析 by:授客 QQ:1033553122 磁盘分区 任何硬盘在使用前都要进行分区.硬盘的分区有两种类型:主分区和扩展分区.一个硬盘上最多只能有4个主分区,其中一个主分区 ...
- loadrunner 场景设计-目标场景设计
场景设计-目标场景设计 by:授客 QQ:1033553122 A. 概述 Goals Types for Goal-Oriented Scenarios 在以目标为向导的场景中,定义你想实现的测 ...
- 框架模式MVC在安卓中的实践
我们采用ListView来演示我们的MVC模式,目录结构: 实体类:包含了书的名字和图片信息 public class Book { //书名 private String name; //书的图片 ...
- 我的简历 PHP Java C# 技术总监
石先生 ID:303321266 目前正在找工作 13611326258 hr_msn@163.com 男|32 岁 (1985/08/06)|现居住北京-海淀区|12年工作经验 ...
- Mvc检查图片格式后上传
/// <summary> /// 检查是否文件是否图片并保存 /// </summary> /// <param name="file">文件 ...
- 【Linux】磁盘的分区与命名规则
1,Startx:切换到图形界面 2,Pwd:查看当前目录 3,Whoami:查看当前用户 4,Cd: 1. 命令格式: cd [目录名] 2. 命令功能: 切换当前目录至dirNam ...
- 三种方法更改MAC OS X下的HOSTS文件
1.终端更改 用程序里面打开终端(terminal),输入 sudo vi /etc/hosts 然后提示输入系统密码 hosts文件就自动打开了 接着输入 i 进入编辑模式 将添加的网站,ip拷贝进 ...
- python第四十五课——继承性之多继承
测试模块 演示多继承的结构和使用: 子类:Child 直接父类(多个):Father.Mother 注意: 由于有多个直接父类,多个父类都要自己给其属性赋值, 避免混淆,我们使用类名.__init__ ...