微信小程序中换行,空格(多个空格)写法

在HTML5中我们都知道编辑文档换行的时候直接用<br>就可以了，但在wxml中却识别不了<br>标签。

空格，换行在小程序中的写法整理如下：

必须在<text>标签中！

一、空格

js:

Page({data: {text0: '这是一个段落 \n 看我变身换行',text1:'这是一个段落 看我空格',},
})

wxml:

<view><text>这是一个段落 \n 看我变身换行</text>
</view>
<view><text>{{text0}}</text>
</view>

二、空格及连续空格

<view><text style="white-space:pre-wrap">{{text1}} ———— white-space:pre-wrap 文本保留空格和回车</text>
</view>
<view><text>这是一个段落\t\t\t\t\t\t看我空格（ 多个只会显示一个空格） </text>
</view>
<view><text decode="{{true}}">我要&ensp;开始&ensp;&ensp;&ensp;空格了（空格是中文字符一半大小）</text>
</view>
<view><text decode="{{true}}">我要&emsp;开始&emsp;&emsp;&emsp;空格了（空格是中文字符大小）</text>
</view>
<view><text decode="{{true}}">我要&nbsp;开始&nbsp;&nbsp;&nbsp;空格了（空格根据字体设置）</text>
</view>

后台传入的富文本换行，在富文本中 \n 会被当做字符串处理，只有在js文件中写入 \n，才能被正确转义实现换行。

转载于:https://www.cnblogs.com/xiao-ling-zi/p/9323526.html

微信小程序中换行,空格(多个空格)写法相关推荐

微信小程序中换行空格（多个空格）
一.空格,换行小程序中的写法为: <text> 你好!\t七月流火啊!\n我在下一行 </text>\t 空格( 多个只会显示一个空格) \n 换行二.连续空格 <v ...
php小程序中的页面如何换行,解决微信小程序scroll-view换行问题
今天在写小程序的时候使用了scroll-view,但是发现在scroll-view中一行文字不能换行,代码如下: asdhadjhkajshdkjahsdkjasdajsdhkajsdkajsdkaj ...
微信小程序中的空格怎么打
微信小程序中的空格怎么打? decode="{{true}}" 加 &nbsp: <text decode="{{true}}">1234 ...
如何在微信小程序中实现文本换行？
description: "如何在微信小程序中\n实现文本换行?" <text class="text-white"space="ensp&qu ...
微信小程序中如何设置textarea或者van-field中的placeholder换行显示
微信小程序中如何设置textarea中的placeholder换行显示 van-field 中直接修改textarea 标签的样式即可 <textarea class="txt_wor ...
在微信小程序中如何对复制的信息进行换行
在微信小程序中如何对复制的信息进行换行只需要在想换行的文本后边加上'\n'即可
微信小程序内容换行
微信小程序内容换行不能用<br/> 解决:微信小程序中内容换行不能用<br/>,用\n,并且必须放在<text></text>标签内生效,否则会解析成空 ...
taro+vue微信小程序文本换行
文本换行在微信小程序中 br是不管用的无法识别解决方法:使用 \n 例子: <view>文本换行<text>{{ br }}</text>文本换行文本换行文本换 ...
微信小程序中尺寸单位rpx及样式的用法
rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应.规定屏幕宽为750rpx.如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375p ...

微信小程序中换行,空格(多个空格)写法

微信小程序中换行,空格(多个空格)写法相关推荐

最新文章

热门文章