Result 结果页

结果页组件

注意事项

• 结果页可包含错误页面，操作成功提示页等多种类型
• 结果页可配置标题，描述与提示图片

效果

使用方法

<template>
  <div class="wxc-demo">
    <lc-result  :icon="icon"
                :title="title"
                :desc="desc"
                padding-top="116"
                @onResultClick="resultClicked"
                class="result"
                ></lc-result>
  </div>
</template>

<style scoped>
  .wxc-demo {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: #fff;
  }
  .result{
    background-color: rgb(242, 243, 244);
  }
</style>

<script>
  import TYPE from 'result.js';

  export default {
    data: () => ({
      icon: TYPE['error']['icon'],
      title: TYPE['error']['title'],
      desc: TYPE['error']['desc'],
    }),
    methods: {
      resultClicked (e) {
        this.$toast.text(`${e.title}`);
      }
    }
  };
</script>

result.js

export default {
    success: {
      icon: 'https://dqloa7ej5.lightyy.com/images/lightui/error.png',
      desc: '付款成功，请耐心等待商品发货',
      title: '付款成功'
    },
    error: {
      icon: 'https://dqloa7ej5.lightyy.com/images/lightui/error.png',
      desc: '银行卡余额不足',
      title: '付款失败'
    },
    warning: {
      icon: 'https://dqloa7ej5.lightyy.com/images/lightui/error.png',
      desc: '哎呀，没有网络了......',
      title: '付款异常'
    }
  }

可配置参数

Prop	Type	Required	Default	Description
data	Object	Y	-	结果页包含的标题，描述与图片

• data中包含title，desc，icon。