汇付支付斗拱线下账单支付 vue 组件库（dg-bill-plugin）

[其宝]

线下账单支付 vue 组件库

Repository：https://github.com/huifurepo/dg-bill-plugin

简介

解决重复造轮子的问题：提供一套专为手机端账单支付场景打造的UI 组件库，帮助开发者快速搭建账单页面，提升用户体验，无需担心适配，简化逻辑管理

组件列表

• 账单金额组件
• 账单支付按钮组件
• 账单 Banner 组件
• 账单公告组件
• 账单详情文本组件
• 账单明细选择组件
• 账单分割占位组件

组件模拟器

查看演示

接入说明

安装

npm i @chinapnr/dg-bill-plugin

配置 easycom

打开 /src/pages.json 进行配置

  "easycom": {
    "autoscan": false,
    "custom": {
      "mx-(.*)": "@chinapnr/dg-bill-plugin/lib/$1/index.vue"
    }
  }

在 /src/App.vue 中添加组件样式

@import '@chinapnr/dg-bill-plugin/lib/styles/matrix.scss';

在 /src/pages 文件夹内的任意 vue 文件中，直接使用组件库标签

<template>
  <mx-bill-notice>缴费公告</mx-bill-notice>
</template>