前端处理后端返回的数据中有\n\n字样的换行符标识

这篇具有很好参考价值的文章主要介绍了前端处理后端返回的数据中有\n\n字样的换行符标识。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

后端返回的数据:

前端显示换行符,前端

上面圈着的部分就是\n,前端需要将数据进行换行,对于这类型的数据,在前端页面是需要进行稍微处理才能正常显示。如果没有经过处理,那么内容是不会在有换行符的位置进行换行显示的

解决办法1:

使用css属性:

white-space:pre-line
或
white-space:pre-wrap

pre-wrap:连续的空白符会被保留。在遇到换行符或者< br >元素,或者需要为了填充「行框盒子(line boxes)」时才会换行

pre-line连续的空白符会被合并。在遇到换行符或者< br >元素,或者需要为了填充「行框盒子(line boxes)」时会换行

解决办法2:

使用v-html输出文本

v-html="xxx.replace(/\n\n/g, '<br>')"

以上两种方法都可以实现文章来源地址https://www.toymoban.com/news/detail-723442.html

到了这里,关于前端处理后端返回的数据中有\n\n字样的换行符标识的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 后端返回二进制流,前端处理二进制文件流,实现预览图片以及PDF

    1、首先预览PDF需要 后端 将响应头 Content-Type 设置为PDF类型 application/pdf ,不能预览,会直接下载 2、 前端 定义接口:并设置相应类型 responseType 为 blob 请求数据:通过 window.URL.createObjectURL(res) 转成本地预览地址, 在通过 window.open() 方法打开转成本地预览地址即可预览PDF,如下

    2024年02月15日
    浏览(55)
  • 后端java 如何返回给前端 JSON数据

    在上述代码中,@ResponseBody注解用于将Java List对象转换为JSON格式的数据,并返回给前端。Spring会自动将List对象转换为JSON格式的数组,其中每个元素都是一个JSON对象。在本例中,每个JSON对象都包含一个name属性和一个age属性。 Regenerate

    2024年02月15日
    浏览(42)
  • 前端打开后端返回的HTML格式的数据

    前端打开后端返回的 HTML格式 的数据: 注:如果后端返回的是一个网址则不使用这个方式,可以使用 iframe / 标签 在本地打开返回的网址:示例如下: iframe /  具体使用请参考

    2024年02月12日
    浏览(45)
  • 前端渲染后端返回的HTML格式的数据

    在日常开发中,经常有需要前端渲染后端返回页面的需求,对于不同数据结构,前端的渲染方式也不尽相同,本文旨在对各种情况进行总结。 数据包含html标签等元素,数据类型如下图: 前端通过 js 方式处理 前端需要渲染网址中的页面,可通过iframe实现: 数据包含部分标签

    2024年02月08日
    浏览(53)
  • 后端返回数据流,前端进行转换blob文件流

    1. 首先相应的头里面请求改为 responseType: \\\'blob\\\' 2.           let res = await getPhotoVideoUrl() --此处为模拟的获取一个视频流的地址;         const img = new Blob([res], { type: \\\'image/png\\\' });         let imgUrl = window.URL.createObjectURL(img); 3.拿到流的地址后,先进行new Blob进行创建一个对象。

    2024年02月13日
    浏览(40)
  • uni-app开发微信小程序数据 \n 换行符失效问题

    前言 使用uni-app开发微信小程序时,使用text显示字符串(字符串带n),需要在n处直接换行。 1、本地字符串,可以直接换行显示。 2、后台返回字符串,直接换行失效。原因:渲染时 n 直接被当成字符串处理了,根本不识别。 效果图       实现 1、使用replace()方法,字符

    2024年02月15日
    浏览(55)
  • 解决:Java后端返回给前端的Date格式数据相差8小时的问题

    问题描述: 后端得到的数据是对的,但是返回给前端后,数据比原数据慢了8小时。 原因: json数据在返回浏览器端是会被spring-boot默认的Jackson框架转换,而Jackson框架默认的时区GMT(相对于中国是少了8小时)。 解决: 在application.yml文件中,配置

    2024年04月16日
    浏览(58)
  • 【JavaScript】后端返回的二进制流音频数据或本地音频资源,前端如何播放?

    如果我们要使用本地的音频资源,在 vue3 中那么我们需要对资源的地址做一下处理 后端返回二进制流音频数据,怎么让其可播放 前端播放二进制语音流

    2024年02月03日
    浏览(61)
  • java后端返回数据给前端时去除值为空或NULL的属性、忽略某些属性

    目录 一、使用场景 二、环境准备 1、引入依赖 2、实体类 三、示例 1、不返回空值 (1)方式 (2)测试 (3)说明 2、不返回部分属性 (1)方式 (2)测试 四、 Jackson常用注解 1、 @JsonProperty 2、@JsonPropertyOrder 3、@JsonInclude 4、@JsonIgnoreProperties 5、@JsonFormat 6、@JsonUnwrapped         在开发过程

    2024年02月04日
    浏览(48)
  • 纯前端 导出Excel文件(包括导出用数组数据模拟文件数据和实际后端返回的文件数据)的 方法

            在纯前端导出文件的一种常见方法是通过生成下载链接来实现,可以使用Blob对象和URL.createObjectURL()方法来实现,因为现在工作中主要运用的前端框架是Angular,这篇文章将以angular为例进行阐述。 一、示例代码 1. 首先,安装FileSaver库(https://github.com/eligrey/FileSaver.j

    2024年04月23日
    浏览(33)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包