微信小程序中的空格与换行

前言

最近在做微信小程序,也是第一次接触它,遇到了不少问题,这里记录一下关于空格和换行的问题。
我想实现的效果很简单,如下所示:
在这里插入图片描述

空格

最开始打了几个空格试了一下,果然如html一样没有成功!
然后我又在text标签内试一下 ,咦,还是不行!
然后我又在text标签外试了一下\nbsp;,嘿嘿,还是不行!
听说\t可以来着,尝试一波,nice,依然不行!

经过一系列的搜索,终于找到了,text标签有一个属性是decode用来解码,官方文档说decode可以解析的有   < > & '    
就是你了。示例如下:

<text decode="{{true}}">&nbsp;&nbsp;&nbsp; {{item.sex}}</text>

换行

这个也有点意思。
第一时间,我想的是添加一个标签<br />,emmm,wxml好像不认识这个标签,
然后我就想啊,text相当于html中的span,我可以换一个相当于div的view标签就可以了涩,试了一下,可以肯定是可以的,但是我想没必要啊,都是文字干嘛要用view,
再搜了一波,emmm,找到了,text内容里加上 \n 就可以完成换行了。
搞定!

<text class="text3">\n {{item.classify}} </text>

最后巧合发现了不加东西,我直接把内容换行就可以实现换行。代码如下。

<text class="text3">
  {{item.classify}}
</text>

效果图

最后实现的效果如下。
在这里插入图片描述
这个多用几次想忘记都难,不过对刚开始学小程序的可能不太清楚,大家共同学习。记录于此。

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值