小程序text文本中一些属性使用

一. 属性说明

属性名类型默认值说明
selectableBooleanfalse是否支持文本的选中功能
spaceStringfalse显示连续空格。
decodeBooleanfalse是否解码 decode可以解析的有  < > & '    
  1. space 设置space的不同值,可以让文本中的空格显示不同的间距。 这三个也叫不换号空格。 意思是前后字符和这个空格符号作为一个整体。不会中间换行。
    • ensp-> 中文字符空格一半大小。
    • emsp-> 中文字符空格大小.
    • nbsp-> 根据字体设置的空格大小
  2. decode 可以解析字符实体。
显示结果描述实体名称
 空格 根据字体设置的空格大小 
 空格 中文字符空格大小 
 空格 中文字符空格一半大小 
<小于号&lt;
>大于号&gt;
&和号&amp;
  1. text 支持 \n 换行
  2. 应用 首段缩进两个字的间距
// 一定要开启是否解码(decode).  文本前面加上 `&emsp;&emsp;`
<text decode="{{true}}">&emsp;&emsp;首行空两格\n第二行</text>

注意:space是针对文本中的空格符号。decode是针对文本中存在的字符实体。

二. 代码

  • wxml
<view class="container">
  <text class="text" selectable="{{false}}" space="ensp">中文 字符空格一半大小</text>
  <text class="text" space="emsp">中文 字符空格大小</text>
  <text class="text" space="nbsp">根据 字体设置的空格大小</text>
</view>

<text decode="{{true}}">&emsp;&emsp;首行空两格\n第二行</text>
  • wxss
.container {
  display: flex;
  flex-direction: column;
}

.text {
  font-size: 50rpx;
}

 

 

 

posted @ 2020-10-27 09:16  JackieDYH  阅读(19)  评论(0编辑  收藏  举报  来源