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

在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

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值