在vue3+js+vite的项目中如何对后端返回数据格式进行全部展示，包含空格。

最新推荐文章于 2024-07-12 10:14:29 发布

Joy_nn

最新推荐文章于 2024-07-12 10:14:29 发布

阅读量307

点赞数

文章标签： javascript css3 html5

本文链接：https://blog.csdn.net/Joy_nn/article/details/132578558

版权

文章讨论了HTML页面中，由于默认合并连续空格，可能导致前后端数据显示问题。为解决数据库中的两个空格显示为单个&nbsp;的问题，文章介绍了一种使用`replace()`方法替换所有连续空格为非-breakingspace(&nbsp;)的技巧。

摘要由CSDN通过智能技术生成

由于在HTML 默认会合并连续的空格为一个空格

<div class="title">{{ item.group_title.replace(/ /g, ' ') }}</div>

item.group_title是后端需要展示的字段，但是有时候数据库里的字，是两个空格连在一起的时候，前端仅仅调用字段，展示出来的效果会自动合并连续空格。所以这种方法会将所有的空格替代为&nbsp

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Joy_nn

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

个人博客-SpringBoot+Vue3项目实战（2）- 使用Vite搭建Vue3项目并安装Element Plus

专注于图像领域，主要研究内容包括计算机视觉和深度学习，特别是在图像分类、目标检测和图像生成等方面有深入的研究和实践经验。

03-26

1万+

从本文开始，项目正式开始！！！在如今的前端开发中，大厂基本使用React，小厂主要使用Vue。Vue易上手，心智负担地，所以成为很多企业的前端框架首选。无论你是前端还是后端，我都建议你先学习Vue。Vue2和Vue3。既然是学习，那我们就选择最新版本的Vue学习。较Vue2Vue3的最大优点就是推出了·Composition API·。。目前市面主流的是两种Vue3和Vite+vue3。本项目采用Vite+Vue3的组合方式进行前端开发，主要还是因为Vite贼**快。

vite vue3 规范化与Git Hooks - 基于 vite 创建 vue3 全家桶项目(续篇）

youyacoder的博客

10-14

556

hooks意思是“钩子”，也就是在执行某个操作之前或之后要做的事。git hooks 就是 git 操作的钩子，在 git 执行某个操作之前或之后要做的事，如 git 提交后、提交后、合并前、合并后、rebase前、rebase后等。pre-commitpre-commit是git commit执行前的钩子，会在获取提交描述信息且提交前被调用，根据该钩子决定是否拒绝提交。可以在这个钩子中对代码进行 eslint 检查。commit-msgcommit-msg也是git commit。

参与评论您还未登录，请先登录后发表或查看评论

vue3中当后端返回的数据格式为“{“url“:“https:...“}“时，数据回显问题

m0_52761651的博客

04-07

479

vue3中当后端返回的数据格式为“{“url“:“https://gateway.dev.medipath.com.cn/cif/uploa“}“时，数据回显问题

vue3 reactive 数据回显问题

qq_38210427的博客

06-13

523

vue3 reactive 数据回显问题 - 简书

[Vue3 + TS + Vite] 将所展示文本内容的换行与空格显示出来

最新发布

qq_45831414的博客

07-12

599

pre>

vue3将这样的数据格式： [ {name: ‘xxx‘, ‘time‘: ‘2023-12-06 00:00:00‘, speed: ‘2‘}变成这样：[ {‘name‘: ‘xxx‘, ‘1时‘

weixin_45960031的博客

12-12

484

将这样的数据格式： [ {name: 'xxx', 'time': '2023-12-06 00:00:00', speed: '2'}, {name: 'xxx', 'time': '2023-12-06 00:01:00', speed: '2'}, {name: 'xxx', 'time': '2023-12-06 00:02:00', speed: '2'}, ]变成这样：[ {'name': 'xxx', '1时': '风速', '2时': '2'}]

vue中返回啥的数据有空格怎么显示_vue中如何去掉空格

weixin_39614060的博客

12-21

646

一、问题vue中当用户提交表单时，有的数据需要去掉前后空格然后再向后端发送。二、解决方法首先可以使用v-model.trim这个v-model修饰符去解决它，但是当用户输入\u200B时，这个方法就不奏效了，这时我们可以去一下v-model.trim这个修饰符的源码function genDefaultModel (el: ASTElement,value: string,modifiers: ?...

前端对于后端返回连续空格的展示问题

weixin_42241989的博客

07-21

2572

后端返回数据格式带多个连续空格，前端只展示一个空格问题解决

vite+vue3+TypeScript 搭建项目基本框架_vite vue typescript

2401_84264429的博客

04-15

945

先自我介绍一下，小编浙江大学毕业，去过华为、字节跳动等大厂，目前阿里P7深知大多数程序员，想要提升技能，往往是自己摸索成长，但自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！因此收集整理了一份《2024年最新Golang全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友。既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上Go语言开发知识点，真正体系化！由于文件比较多，这里只是将部分目录截图出来，全套包

【vue3+ts后台管理】项目搭建

Errol's Blog

07-07

2332

Vue3+ts后台管理项目搭建

vue3-wangeditor:基于Wangeditor富文本编辑器，用于Vue3.x的组件

04-02

vue3-wangeditor :open_book:项目介绍 vue3-wangeditor是一种基于wangEditor二次封装的Vue3.x的Web富文本编辑器，轻量，简洁，易用，开源免费。兼容常见的PC浏览器：Chrome，Firefox，Safar，Edge，QQ浏览器，IE...

vue页面中怎么显示多个空格-从普通空格到非断行空格与v-html的使用

qq_42816270的博客

04-27

1194

v-html 的内容直接作为普通 HTML 插入—— Vue 模板语法是不会被解析的。在单文件组件，scoped 样式将不会作用于 v-html 里的内容，因为 HTML 内容不会被 Vue 的模板编译器解析。在你的站点上动态渲染任意的 HTML 是非常危险的，因为它很容易导致 XSS 攻击。请只对可信内容使用 HTML 插值，绝不要将用户提供的内容作为插值。产生的原因是因为在浏览器进行解析的时候，会将多个空格合并成分成一个空格。可能跟使用vue2有关吧，上述的演示的代码使用的是vue3。

【前端】如何将后端返回的数据遍历展示在前端页面

m0_64210833的博客

05-29

4483

如何将后端返回的数据遍历展示在前端页面

vue3 中保留文本中空格和换行 white-space: pre-wrap

Ll307748784的博客

03-04

1378

我们添加了style = "white-space: pre-wrap" 这个属性的时候。我们打一个比方说后端传入的文本是有空格换行的时候我们想进行复原显示的话。标签）也会被保留，并且会在这些位置换行。

vue cli3 代码检验空格报错

狼将行的博客

04-07

592

简单解决方案：取消缩进校验打开目录下的 package. json, 修改 “rules”:{“indent”:“off”}, ok！现在不会缩进报错了！

详解Vue如何将多个空格被合并显示成一个空格

菜鸟教程

05-08

1005

教程下载地址：网赚博客https://www.piaodoo.com/创业项目排行榜前十名https://www.piaodoo.com/

vue常用数字显示规则

955姜太根的博客

02-07

885

vue常用数字显示规则

vue去掉所有输入框两边空格，封装指令去空格，支持Vue2和Vue3，ElementUI Input去空格

阿飞

08-08

6451

解决Vue v-model.trim 去空格问题，让你的Input轻松去掉两边空格，支持原生，支持Element UI 的Input，支持 TextArea, Vue2,Vue3

vue3+vite+js动态生产后端返回的路由表

05-16

首先，你需要在后端实现一个接口，返回路由表的数据。这个接口可以是一个 RESTful API，也可以是其他类型的接口。然后，在前端代码中，可以使用 axios 或者其他类似的库，从后端获取路由表的数据。获取到数据后，...