组件库文档 tmui.design 
显示更多 More 
超过指定高度,默认隐藏更多内容。
🌶️ 显示更多 More 示例 
查看模拟效果+
示例模板
vue
<template>
	<tm-app>
		<tm-sheet>
			<tm-text :font-size="24" _class="text-weight-b" label="基础示例,更多见文档"></tm-text>
			<tm-divider></tm-divider>
			<tm-more>
				<tm-text :label="text"></tm-text>
			</tm-more>
			<tm-divider></tm-divider>
			<tm-text :font-size="24" _class="text-weight-b" label="下面是打开前的勾子,不允许查看"></tm-text>
			<tm-divider></tm-divider>
			<tm-more :beforeOpen="beforeOpen">
				<tm-image :width="636" :height="120" src="https://picsum.photos/636/120"></tm-image>
				<tm-text :label="text"></tm-text>
			</tm-more>
		</tm-sheet>
	</tm-app>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import tmApp from '@/tmui/components/tm-app/tm-app.vue'
import tmSheet from '@/tmui/components/tm-sheet/tm-sheet.vue'
import tmText from '@/tmui/components/tm-text/tm-text.vue'
import tmImage from '@/tmui/components/tm-image/tm-image.vue'
import tmDivider from '@/tmui/components/tm-divider/tm-divider.vue'
import tmMore from '@/tmui/components/tm-more/tm-more.vue'
const text =
	'英国广播公司(BBC)24日再次“爆料”,称黑客从新疆警方电存数据,其中包括“存数据,其中包括“存数据,其中包括“存数据,其中包括“脑服务器中获取了大量缓存数据,其中包括“再教育中心”“囚犯”照片。该报道刚刚发出,美国国务院和英国外交部就一齐上阵,夸张地表示“震惊”和“愤慨”。不得不说,在编造涉疆谎言方面,美西方舆论和政客的相互配合,已经熟练到“肌肉记忆”的程度。'
function beforeOpen() {
	uni.showLoading({ title: '...' })
	return new Promise((res, rej) => {
		setTimeout(function () {
			uni.hideLoading()
			rej()
			uni.showToast({ title: '不允许阅读', icon: 'none' })
		}, 1500)
	})
}
</script>🌶️ 兼容性 
| APP-VUE | APP-NVUE | 小程序 | WEB/H5 | VUE3/TS | 
|---|---|---|---|---|
| ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | 
🌱 参数 
本组件含有公共属性 公共属性
| 参数名 | 类型 | 默认值 | 描述 | 
|---|---|---|---|
| height | Number | 250 | 超过指定高时隐藏并显示更多。 | 
| openLabel | String | '收起更多' | 展开时显示的文字 | 
| closeLabel | String | '展开更多' | 收起时显示的文字 | 
| beforeOpen | [Function, Boolean] | "" | 在点击打开之前执行。如果返回false,将阻止查看内容。Function可以返回Promise | 
| lightMaskColor | string[] | ['rgba(255, 255, 255, 1)','rgba(255, 255, 255, 0.7)'] | 亮系时的遮罩颜色(渐变) | 
| darkMaskColor | string[] | ['rgba(0, 0, 0, 1)','rgba(0, 0, 0, 0)'] | 暗系系时的遮罩颜色(渐变) | 
🌹 事件 
| 事件名 | 参数 | 返回数据 | 描述 | 
|---|---|---|---|
| @change | 打开和隐藏时触发,返回当前打开的状态值。 | 
🌽 slot插槽 
| 属性名称 | 类型 | 数据 | 说明 | 
|---|---|---|---|
| more | 自定义底部展开和收起更多的工具条 | 
🥗 ref方法 
无
贡献者 
Mr.童
