更新记录

1.0.2（2023-06-13）

代码优化。

1.0.1（2023-04-12）

• 这是一个通用的结果页组件，主要是对前一步操作的结果进行反馈。
• 插件符合uni_modules和easycom规范，导入后可直接在页面通过标签引用。

平台兼容性

kevy-result-page

介绍

这是一个全端通用的结果页组件，简单的设置完成一个反馈页面展示。 祝您使用愉快，本插件会长期维护更新，开源不易，如果本插件对您有帮助的话请及时点个好评吧或者赞赏一下，总之谢谢您的鼓励啦。

方法和属性

details字段说明（Object对象属性）

使用方式

插件详情页点击导入hbuilder即可。插件符合uni_modules和easycom规范，导入后可直接在页面通过标签引用。

代码使用示例

<template>
    <view class="content">
        <kevy-result-page v-if="type" :type="type" :title="title" :description="description" :details="details" primaryBtnText="主要操作" secondaryBtnText="次要操作" @primaryBtnClick="primaryBtnClick" @secondaryBtnClick="secondaryBtnClick"></kevy-result-page>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                //类型：可选参数为success、info、error、waiting、warning
                type:'',
                //标题
                title:'',
                //描述
                description:'',
                //详情数据列表
                details:[],
            }
        },
        onLoad() {
            //这里模拟请求到了数据后设置组件
            this.type = 'success';
            this.title = '预约成功';
            this.description = '这里是操作描述，内容会自动换行，建议最多设置两行更佳好';
            this.details = [{
                        label: '预约人',
                        value: '张某某',
                        bold: true,
                    },
                    {
                        label: '预约地点',
                        value: '秦岭野生动物园',
                    },
                    {
                        label: '预约时间',
                        value: '2023/4/8 13:23',
                    },
                    {
                        label: '流水号',
                        value: '1000802909309389',
                    },
                    {
                        label: '备注',
                        value: '携带相关证件享受优惠',
                    }
                ];

        },
        methods: {
            primaryBtnClick(){
                console.log("主要按钮被点击了");
            },
            secondaryBtnClick(){
                console.log("次要按钮被点击了");
            }
        }
    }
</script>

<style scoped>
    .content {
        box-sizing: border-box;
    }
</style>