支付宝小程序基础组件 文本·Text

2020-09-18 11:07 更新

文本。

扫码体验

示例代码

  1. <!-- API-DEMO page/component/text.axml -->
  2. <view class="page">
  3. <view class="page-description">
  4. <view class="text-demo-title">
  5. <text class="text-demo-text">这是一段文本。\n<text>\</text><text>n</text> 可以换行。</text>
  6. </view>
  7. </view>
  8. <view class="page-section">
  9. <view class="page-section-demo">
  10. <text>{{text}}</text>
  11. </view>
  12. </view>
  13. </view>
  14. // API-DEMO page/component/text.js
  15. Page({
  16. data: {
  17. text: `支付宝是一个大型生活服务类的平台,用户群非常广泛,上至五六十岁,下至十几岁。
  18. 这里不仅有官方自营应用,还有第三方接入应用,用户的选择很多。
  19. 只有你的产品做得足够简单,才能让更多的用户使用。而更多人的使用,也意味着你更大的收益。\n\n:)
  20. `,
  21. },
  22. });
  23. /* API-DEMO page/component/text.acss */
  24. .page {
  25. padding: 0;
  26. }
  27. .text-demo-title {
  28. margin-left: 30rpx;
  29. margin-top: 30rpx;
  30. }
  31. .text-demo-text {
  32. font-size: 36rpx;
  33. }

属性

属性名 类型 默认值 描述 最低版本
selectable Boolean false 是否可选。 -
space String - 以何种方式显示连续空格。 -
decode Boolean false 是否解码。为 true 时表示对文本内容进行解码,可解析的 HTML 实体字符有: <>&'   -
number-of-lines Number - 多行省略,值须大于等于1,表现同 css 的 -webkit-line-clamp 属性一致。 -

space 有效值

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

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

以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号