更新记录

1.0.1(2025-06-27) 下载此版本

修改插件使用名称

1.0.0(2025-06-27) 下载此版本

初版


平台兼容性

uni-app

Vue2 Vue3 Chrome Safari app-vue app-nvue Android iOS 鸿蒙
× - - -
微信小程序 支付宝小程序 抖音小程序 百度小程序 快手小程序 京东小程序 鸿蒙元服务 QQ小程序 飞书小程序 快应用-华为 快应用-联盟
- - - - - - - - - -

uni-app x

Chrome Safari Android iOS 鸿蒙 微信小程序
5.0 12 -

其他

多语言 暗黑模式 宽屏模式
× ×

使用说明


开箱即用,支持高度自定义:可自由设置文本样式、展开/收起按钮文字及样式,并能指定展开行数等。操作流畅如丝,无闪动、无卡顿,带来德芙般的顺滑体验。

使用方式
 下载后可直接使用,插件符合uni_modules规则
示例
  <zh-readMore :text="text"></zh-readMore>

参数说明


参数 类型 默认值 描述
text String '' 需要展示的文本
textStyle Object {'color': '#000','font-size': '28rpx','font-weight': '400'} 需要展示的文本样式
rows Number 3 文本容器中超出多行后显示省略号
lineBreak Boolean true 保留空白字符序列,同时允许正常换行
packupLineBreak Boolean false 只在收起时,忽略空白字符;展开时,保留空白字符序列,同时允许正常换行
unfoldText String 展开 展开操作的文案
unfoldTextStyle Object {'color': '#206ef7','font-size': '28rpx','font-weight': '400'} 展开操作的样式
packupText String 收起 收起操作的文案
packupTextStyle Object {'color': '#206ef7','font-size': '28rpx','font-weight': '400'} 收起操作的样式
duration Number/String 0.1 展示动画过度时间(单位s)

Event 事件


事件名 说明 回调参数
click 展开/收起时的事件 展开true 收起false
vue3示例
<template>
    <view>
        <zh-readMore :text="text"></zh-readMore>
    </view>
</template>

<script lang="ts" setup>
    import { ref } from 'vue'
    const text = ref('暮色渐沉,天边最后一缕霞光温柔地融化在远山的轮廓里。微风拂过,树叶沙沙低语,仿佛在诉说某个古老的秘密。溪水潺潺,映着星光,如碎银般闪烁。夜莺的歌声从林间飘来,清亮而孤独,与夜色交织成一片静谧的梦。这一刻,时光仿佛停驻,世界只剩下心跳与自然的呼吸');
</script>
vue2示例
<template>
    <view>
        <zh-readMore :text="text"></zh-readMore>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                    text: '暮色渐沉,天边最后一缕霞光温柔地融化在远山的轮廓里。微风拂过,树叶沙沙低语,仿佛在诉说某个古老的秘密。溪水潺潺,映着星光,如碎银般闪烁。夜莺的歌声从林间飘来,清亮而孤独,与夜色交织成一片静谧的梦。这一刻,时光仿佛停驻,世界只剩下心跳与自然的呼吸'
            }
        }
    }
</script>

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问