Skip to content
On this page

组件库文档 tmui.design

结果页 Result

主要用来显示页面当前状态,比如空,出错等。


🌶️ 结果页 Result 示例

查看模拟效果
示例模板
vue
<template>
    <tm-app color="white">
        <tm-sheet>
            <tm-text :font-size="24" _class="font-weight-b" label="基础示例,更多见文档"></tm-text>
        </tm-sheet>
       <tm-result color="green" status="success"></tm-result>
       <tm-result :showBtn="false"></tm-result>
       <tm-result :showBtn="false" color="red" status="network"></tm-result>
        
    </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 tmResult from "@/tmui/components/tm-result/tm-result.vue"
</script>

🌶️ 兼容性

APP-VUEAPP-NVUE小程序WEB/H5VUE3/TS
✔️✔️✔️✔️✔️

🌱 参数

本组件含有公共属性 公共属性

参数名类型默认值描述
statusString'empty'empty,error,success,warning,lock,network
iconString''图标名称或者图片地址
colorString'primary'图标颜色
titleString''标题
subTitleString''标题下的副标题描述
btnTextString'确认'按钮文字
followTheme[Boolean]true是否跟随全局主题的变换而变换
followDark[Boolean]true是否跟随暗黑
text[Boolean]true是否浅色背景
size[Number]140尺寸
dark[Boolean,String]false暗黑
showBtnBooleantrue是否显示底部的操作按钮。
clickDisabledBooleantrue默认禁用。是否禁用整个组件的点击事件触发。

🌹 事件

事件名参数返回数据描述
@clickevent点击按钮时触发
@resultClickevent点击整个组件时触发,可通过clickDisabled禁止触发

🌽 slot插槽

属性名称类型数据说明
default

🥗 ref方法

贡献者

Mr.童