t-read-more

ReadMore 展开更多

组件介绍

t-read-more 是展开阅读更多组件，用于在内容区域提供折叠和展开功能，允许用户根据需要查看更多或更少的内容。

平台兼容

Harmony	H5	Android	iOS	小程序	UTS
✅	✅	✅	✅	✅	✅

基础用法

基础用法参考 demo/read-more/read-more.uvue，将需要折叠的内容放在默认插槽中。

<template>
  <t-read-more 
    closeText="展开阅读全文"
    openText="收起"
    :shadow="true">
    <text>
      这是一段很长的文本内容，默认情况下会折叠显示，
      点击展开按钮可以查看完整内容。
      这是一段很长的文本内容，默认情况下会折叠显示，
      点击展开按钮可以查看完整内容。
      这是一段很长的文本内容，默认情况下会折叠显示，
      点击展开按钮可以查看完整内容。
    </text>
  </t-read-more>
</template>

Props

属性名	说明	类型	默认值
closeText	关闭时的提示文字	string	'展开阅读全文'
openText	展开时的提示文字	string	'收起'
shadow	是否显示阴影	boolean	false
shadowClass	阴影的自定义样式	string	-
shadowBoxClass	阴影容器的自定义样式	string	-
moreBoxClass	更多按钮容器的自定义样式	string	-
moreTextClass	更多按钮文本的自定义样式	string	-
moreIconClass	更多按钮图标的自定义样式	string	-
path	点击组件后跳转的页面路径	string	''
hover	是否启用点击效果	boolean	false
type	组件主题类型	string	''
disabled	是否禁用	boolean	false
effect	组件显示主题	string	'normal'
size	组件尺寸	string	'mini'

Slots

插槽名	说明
default	默认插槽，放置需要折叠的内容