vue学习03v-html

  1. v-html指令的作用是:设置元素的内部html链接
  2. 内容有html 的结构会被解析为标签
  3. v-text指令无论内容是什么,只会解析文本
  4. 解析文本使用v-text,需要解析html结构使用v-html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<!-- 开发环境版本-->
<script src="js/vue.js"></script>
<body>
<div id="app">
<p v-html="content"></p>
<p v-text="content"></p>
</div> <script>
var app = new Vue({
el:"#app",
data: {
content:"<a href='https://www.cnblogs.com/ma1998/'>小飞博客园</a>",
} })
</script>
</body>
</html>

两种效果

v-html能解析出来网址,而v-text不能解析

vue学习03 v-html的更多相关文章

  1. Vue学习笔记-1

    前言 本文不是Vue.js的教程,只是一边看官网Vue的教程文档一边记录并总结学习过程中遇到的一些问题和思考的笔记. 1.vue和avalon一样,都不支持VM初始时不存在的属性 而在Angular里 ...

  2. vue学习心得

    前言 使用vue框架有一段时间了,这里总结一下心得,主要为新人提供学习vue一些经验方法和项目中一些解决思路. 文中谨代表个人观点,如有错误,欢迎指正. 环境搭建 假设你已经通读vue官方文档(文档都 ...

  3. vue学习笔记(二)——简单的介绍以及安装

    学习编程需要的是 API+不断地练习^_^ Vue官网:https://cn.vuejs.org/ 菜鸟教程:http://www.runoob.com/vue2/vue-tutorial.html ...

  4. 【Vue学习笔记1】基于Vue2.2.6版本

    记录一下自己关于Vue学习的过程,便于以后归纳整理以及复习. 1.下载引用vue.js 下载: npm install vue ,然后引用. 或直接线上引用: <script src=" ...

  5. day 82 Vue学习二之vue结合项目简单使用、this指向问题

    Vue学习二之vue结合项目简单使用.this指向问题   本节目录 一 阶段性项目流程梳理 二 vue切换图片 三 vue中使用ajax 四 vue实现音乐播放器 五 vue的计算属性和监听器 六 ...

  6. day 81 Vue学习一之vue初识

      Vue学习一之vue初识   本节目录 一 Vue初识 二 ES6的基本语法 三 Vue的基本用法 四 xxx 五 xxx 六 xxx 七 xxx 八 xxx 一 vue初识 vue称为渐进式js ...

  7. vue学习(1) vue-cli 项目搭建

    vue学习(1)  vue-cli 项目搭建 一.windows环境 1. 下载node.js安装包 官网:https://nodejs.org/en/download/ 选择LTS下载 2. 安装 ...

  8. Vue学习笔记十三:Vue+Bootstrap+vue-resource从接口获取数据库数据

    目录 前言 SpringBoot提供后端接口 Entity类 JPA操作接口 配置文件 数据库表自动映射,添加数据 写提供数据的接口 跨域问题 前端修改 效果图 待续 前言 Vue学习笔记九的列表案例 ...

  9. Vue学习之vue-cli脚手架下载安装及配置

    Vue学习之vue-cli脚手架下载安装及配置:https://www.cnblogs.com/clschao/articles/10650862.html 1. 先下载node.js,下载地址:ht ...

随机推荐

  1. Java数据结构——红黑树

    红黑树介绍红黑树(Red-Black Tree),它一种特殊的二叉查找树.执行查找.插入.删除等操作的时间复杂度为O(logn). 红黑树是特殊的二叉查找树,意味着它满足二叉查找树的特征:任意一个节点 ...

  2. drf中View和router的详解

    Rest Framework 视图和路由 因为涉及到视图层面了,而且下面的例子会反复用到request.data,所以我决定带大家稍微看下源码,感兴趣的可以自己深入了解 无论是View还是APIVie ...

  3. 构造清华大学的yum源

    [root@localhost ~]# cd /etc/yum.repos.d/ [root@localhost yum.repos.d]# vim qinghua.repo [qinghua] na ...

  4. windows下TOMCAT对内存使用的设置

    1.打开TOMCAT目录 E:\备份\apache-tomcat-8.5.50-windows-x64\apache-tomcat-8.5.50\bin catalina.bat----------- ...

  5. Q200510-03-02: LRU缓存机制

    问题: LRU缓存机制运用你所掌握的数据结构,设计和实现一个 LRU (最近最少使用) 缓存机制.它应该支持以下操作: 获取数据 get 和 写入数据 put . 获取数据 get(key) - 如果 ...

  6. 20190926-01Redis五大数据类型之List 000 027

  7. 原生JDK网络编程BIO

    服务端提供IP和监听端口,客户端通过连接操作想服务端监听的地址发起连接请求,通过三次握手连接,如果连接成功建立,双方就可以通过套接字进行通信. 传统的同步阻塞模型开发中,ServerSocket负责绑 ...

  8. python3 venv

    介绍 venv 是什么? python3 自带的虚拟环境 为什么需要虚拟环境? 当服务器中需要搭建共存多个环境时(不同环境之间会有冲突) 比如说环境1:需要mongo:3.6版本 / 但是环境2:需要 ...

  9. Java的foreach用法

    foreach其实就是for的加强版,其语法如下: for(元素类型type 元素变量value : 遍历对象obj) { 引用x的java语句; } 举个例子,比如定义一个数组,使用foreach以 ...

  10. Kubernetes-12:Secret介绍及演示

    Secret介绍 Secret存在的意义 Secret解决了密码.token.密钥等敏感数据的配置问题,而不需要把这些敏感数据暴露到镜像或者Pod Spec中,可以以Volume或者环境变量的方式使用 ...