小程序真机调试换行符无效的解决方案
  2024/11/16 11:31:21
  很多小屁孩在开发微信小程序或抖音小程序时发现,换行符\n及\r在电脑编译时没问题,以上真机就不行了。现在讲下解决方案。
通常换行符\n在JS中时可以的,但是在前端真机上确实不行。然而,给文本标签添加style=“white-space: pre-wrap;” ,并用
代替\n是可以实现文本换行的。

在css中white-space属性用来控制容器的文本中带有空白符、制表符、换行符等的显示。

normal:默认,忽略文本中所有的空白、换行符;只有文本存在
或文本达到框的约束时,文本才会换行。
pre:保留文本中的空白、换行符;遇到框的宽度约束时不会自动换行,文本存在
或文本中有换行符时,文本才会换行。
nowrap:和normal类似,忽略文本中所有的空白、换行符;遇到框的宽度约束时不会自动换行,文本只有在有 br 时才会换行。
pre-wrap:和pre类似,保留文本中的空白、换行符;文本存在
或文本中有换行符时,或者遇到框的宽度约束时,文本都才会换行。
pre-line:会略文本中的空白符;文本存在
或文本中有换行符时,或者遇到框的宽度约束时,文本都才会换行。

案例:

<text style="white-space:pre-wrap;border:1px solid #666;background:#eee; width:240px;height:120px;line-height:20px;font-size:11px;line-height:20px;position:relative;top:-506px;padding:20px;display:block" bindtap='bbclose'>
《用户协议及隐私政策》本协议是您在使用本服务过程中所订立的有关用户权益和隐私约定。<br/>
本服务不搜集任何用户隐私,手机号仅用于缓存,特此申明。<br/>
</text>
 [1] [2]

相关文章(向右看)..

·相关
你的小程序如何才能接受H5传递的
win10命令行下成功实现lin
10行代码怎样实现微信小程序支付
微信小程序获取微信登录的open
Unity如何使用HDRP,项目/图
C#unity定时延迟函数的常用
Unity判断物体是否在摄像机视
UnityC#五种方法调用其他脚
C#协程的几种调用方法
u3d出现Autodesk.Fb/图

·热点