阿里云首页 管理控制台

text 文本

扫码体验

image.png

示例代码

<!-- API-DEMO page/component/text.axml -->
<view class="page">
  <view class="page-description">
    <view class="text-demo-title">
      <text class="text-demo-text">这是一段文本。\n<text>\</text><text>n</text> 可以换行。</text>
    </view>  
  </view>
  <view class="page-section">
    <view class="page-section-demo">
      <text>{{text}}</text>
    </view>
  </view>
</view>
// API-DEMO page/component/text.js
Page({
  data: {
    text: `支付宝是一个大型生活服务类的平台,用户群非常广泛,上至五六十岁,下至十几岁。
      这里不仅有官方自营应用,还有第三方接入应用,用户的选择很多。
      只有你的产品做得足够简单,才能让更多的用户使用。而更多人的使用,也意味着你更大的收益。\n\n:)
    `,
  },
});
/* API-DEMO page/component/text.acss */
.page {
  padding: 0;
}
.text-demo-title {
  margin-left: 30rpx;
  margin-top: 30rpx;
}
.text-demo-text {
  font-size: 36rpx;
}

属性

属性名类型默认值描述
selectableBooleanfalse是否可选
spaceString-以何种方式显示连续空格
decodeBooleanfalse是否解码。为 true 时表示对文本内容进行解码,可解析的 HTML 实体字符有:&nbsp;&lt;&gt;&amp;&apos;&ensp;&emsp;
number-of-linesnumber-多行省略,值须大于等于1,表现同 css 的 -webkit-line-clamp 属性一致

space 有效值

说明
nbsp根据字体设置的空格大小
ensp中文字符空格一半大小
emsp中文字符空格大小

说明: 各个操作系统的空格标准并不一致。