解决Vue大括号字符换行踩的坑
作者:小乔FEer 发布时间:2024-04-10 13:47:43
标签:Vue,大括号,字符,换行
最近遇到这样一个问题,在页面上要显示一段自定义的文本,文本如果较长的话需要换行显示。
在HTML中可以通过<br/>标签换行,也可以通过\n转义字符换行
在Vue中用大括号显示的变量,加<br/>会直接被当成字符串显示出来,加\n显示一个空格,加\r\n显示两个空格,因为{{}}}是文本插值,内部都会按照普通字符串进行处理,可以用v-html进行显示
如下显示name变量
data() {
return{
name: '前一部分<br/>后一部分'
}
}
在元素上显示name值
<p v-html="name"></p>
补充知识:使用v-html解决Vue.js渲染过程中html标签不能被解析(html标签显示为字符串)
在网页中,后台传来的json数据中包含html标签,将该json数据绑定到Vue.js中对象中,对该对象进行for循环,发现数据中的html标签不能被解析,而是当作字符显示出来。
问题如下所示:
解决:
Vue.js中提供了v-html这个指令来解决这个问题,或者对数据对象使用{{{vm.data}}}三个大括号来包裹对象,就可以正常解析了。
代码改动如下:
此外某些情况下,使用{{{}}}符号仍然不能解析html标签,但v-htm指令却可以,可能是Vue.js存在的bug吧。
解释见下图
来源:https://blog.csdn.net/oucqsy/article/details/75098213
0
投稿
猜你喜欢
- 面向对象编程时,都会遇到一个概念,类,python也有这个概念,下面我们通过代码来深入了解下。创建和使用类class Dog(): &nbs
- # 比较两个字符串,如果不同返回第一个不相同的位置# 如果相同返回0def cmpstr(str1, str2): &
- 1、python安装可以跨平台2、有两个版本2.7和3.6,第三方库适用2.7版,两个版本不兼容windows安装:第一种方法官网安装:在官
- 数组求和与平均值ls=[4,9,19,8,391,39,9,283,45]sum(ls)average=sum(ls)/len(ls)pri
- 1.安装好JDK下载并安装好jdk-12.0.1_windows-x64_bin.exe,配置环境变量:新建系统变量JAVA_HOME,值为
- 一.在express项目中操作数据库的步骤①安装操作 MySQL 数据库的第三方模块(mysql)②通过mysql模块连接到MySQL 数据
- 进程与线程的历史我们都知道计算机是由硬件和软件组成的。硬件中的CPU是计算机的核心,它承担计算机的所有任务。 操作系统是运行在硬件之上的软件
- 本文实例讲述了Python企业编码生成系统之主程序模块。分享给大家供大家参考,具体如下:一 点睛主程序模块包括三部分:1 主程序初始化2 主
- 杨辉三角,是二项式系数在三角形中的一种几何排列每个数等于它上方两数之和。每行数字左右对称,由1开始逐渐变大。第n行的数字有n项。第n行数字和
- package 的导入语法写 Go 代码的时经常用到 import 这个命令用来导入包,参考如下:import( "f
- 前几天遇到一个问题,需要把网页中的一部分内容挑出来,于是找到了urllib和HTMLParser两个库.urllib可以将网页爬下来,然后交
- 如果可以减少过多的外部隔离的API和简化部署的细节 这会是非常好的。在以前的文章中,我解释了"一些使用反向代理的好处&
- 具体代码和实现方法见下:第一个办法,这个程序可以进行万亿以下的货币金额转换(够用的了吧),其中汉字与数字均按一位计:Function&nbs
- 目录普通分页查询如何优化偏移量大采用id限定方式优化数据量大问题普通分页查询当我们在日常工作中遇到大数据查询的时候,第一反应就是使用分页查询
- Django根据已有数据库表反向生成models类一. 创建一个Django项目django-admin startproject ‘xxx
- 本文为大家分享了python tkinter图形界面代码统计工具,供大家参考,具体内容如下#encoding=utf-8import os,
- 嵌套SELECT语句也叫子查询,形如:SELECT name FROM bbc WHERE region = (SELECT region
- 我就废话不多说了,大家还是直接看代码吧~import tensorflow as tfh_doc=tf.placeholder(tf.int
- 一、前言刚刚学了一些python文件读写的内容,先跑过来整活了。顺便复习一下之前学的东西。import timedoc_local='
- 这篇文章主要介绍了基于python实现从尾到头打印链表,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋