read-more

一个兼容 app,小程序的展开阅读更多组件

开发者:646690173@qq.com

属性

属性名称 类型 默认值 是否必填 说明
nodes String HTML String(avm 的rich-text 咋用这个就咋用)
defaultHeight String 100 默认展示高度,超出该高度的内容将被隐藏
openText String 在全部展示内容下的按钮文字
hiddenText String 在仅展示部分内容下的按钮文字
buttonColor String #fff 按钮背景颜色
buttonTextColor String #000 按钮文字颜色
buttonTextSize Number 10 按钮文字大小
buttonWidth Number 50 按钮宽度(百分比)

事件

事件名 是否必填 说明
open 在隐藏部分内容的情况下点击按钮
hidden 在展示全部内容的情况下点击按钮

方法

方法名 是否必填 说明
readMoreTypeChange 用于切换隐藏部分内容及展示全部内容

食用方法

        <read-more
            :nodes="content"
            defaultHeight="200"
            openText="点击隐藏"
            hiddenText="点击展开"
            buttonColor="#ff1281"
            buttonTextColor="#fff"
            buttonTextSize="16"
            buttonWidth="30"
            @open="open"
            @hidden="hidden"
            ref={this.bindRef}
        />

备注

一定要在组件标签内,一定要加入 ref={this.****} 才能操作组件内的方法,具体操作,请查看demo

是否仍需要帮助? 请保持联络!
最后更新于 2024/02/22