wxc-elip

MinUI 小程序组件 - 文本截断

Install

  1. $ min install @minui/wxc-elip

Demos

单行文本截断

文本截断 elip - 图1

  1. <template>
  2. <wxc-elip>这是一段单行截取的文字。这是一段单行截取的文字。这是一段单行截取的文字。这是一段单行截取的文字。</wxc-elip>
  3. </template>
  4. <script>
  5. export default {
  6. config: {
  7. usingComponents: {
  8. 'wxc-elip': '@minui/wxc-elip'
  9. }
  10. },
  11. data: {},
  12. methods: {}
  13. }
  14. </script>
  15. <style>
  16. </style>

多行文本截断

通过 line 属性设置容许的行数

文本截断 elip - 图2

  1. <template>
  2. <wxc-elip line="2">这是一段 2 行截断的文字。这是一段 2 行截断的文字。这是一段 2 行截断的文字。这是一段 2 行截断的文字。这是一段 2 行截断的文字。这是一段 2 行截断的文字。</wxc-elip>
  3. </template>
  4. <script>
  5. export default {
  6. config: {
  7. usingComponents: {
  8. 'wxc-elip': '@minui/wxc-elip'
  9. }
  10. },
  11. data: {},
  12. methods: {}
  13. }
  14. </script>
  15. <style>
  16. </style>

API

Elip【props】

属性描述
line[可选] 设置多行阶段文本的行数
地址
elip 组件文档 https://meili.github.io/min/docs/minui/index.html#elip
elip 组件源码 https://github.com/meili/minui/tree/master/packages/wxc-elip
MinUI 组件库 https://github.com/meili/minui

Preview

elip

ChangeLog

v1.0.2(2017.11.02)

  • update .npmignore

v1.0.1(2017.10.24)

  • 初始版本