小程序text文本中一些属性使用
一. 属性说明
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
selectable | Boolean | false | 是否支持文本的选中功能 |
space | String | false | 显示连续空格。 |
decode | Boolean | false | 是否解码 decode可以解析的有 < > & '     |
- space 设置space的不同值,可以让文本中的空格显示不同的间距。 这三个也叫不换号空格。 意思是前后字符和这个空格符号作为一个整体。不会中间换行。
- ensp-> 中文字符空格一半大小。
- emsp-> 中文字符空格大小.
- nbsp-> 根据字体设置的空格大小
- decode 可以解析字符实体。
显示结果 | 描述 | 实体名称 |
---|---|---|
空格 根据字体设置的空格大小 | | |
空格 中文字符空格大小 |   | |
空格 中文字符空格一半大小 |   | |
< | 小于号 | < |
> | 大于号 | > |
& | 和号 | & |
- text 支持 \n 换行
- 应用 首段缩进两个字的间距
// 一定要开启是否解码(decode). 文本前面加上 `  `
<text decode="{{true}}">  首行空两格\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}}">  首行空两格\n第二行</text>
- wxss
.container {
display: flex;
flex-direction: column;
}
.text {
font-size: 50rpx;
}
本文来自博客园,作者:JackieDYH,转载请注明原文链接:https://www.cnblogs.com/JackieDYH/p/17634477.html