<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[汇付支付斗拱线下账单支付 vue 组件库（dg-bill-plugin）]]></title><description><![CDATA[<h1><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">线下账单支付 vue 组件库</span></h1><h2>Repository：<a href="https://github.com/huifurepo/dg-bill-plugin" rel="noopener noreferrer" target="_blank">https://github.com/huifurepo/dg-bill-plugin</a></h2><h2><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">简介</span></h2><p><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">解决重复造轮子的问题：提供一套专为手机端账单支付场景打造的UI 组件库，帮助开发者快速搭建账单页面，提升用户体验，无需担心适配，简化逻辑管理</span></p><h2><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">组件列表</span></h2><ul><li><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">账单金额组件</span></li><li><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">账单支付按钮组件</span></li><li><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">账单 Banner 组件</span></li><li><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">账单公告组件</span></li><li><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">账单详情文本组件</span></li><li><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">账单明细选择组件</span></li><li><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">账单分割占位组件</span></li></ul><h2><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">组件模拟器</span></h2><p><u style="color:rgb(9, 105, 218);background-color:rgba(0, 0, 0, 0)"><a href="https://paas.huifu.com/open/doc/devtools/#/m_bill_simulation" rel="noopener noreferrer" target="_blank">查看演示</a></u></p><h2><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">接入说明</span></h2><h4><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">安装</span></h4><pre data-language="plain">npm i @chinapnr/dg-bill-plugin
</pre><p></p><h4><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">配置 easycom</span></h4><p><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">打开 /src/pages.json 进行配置</span></p><pre data-language="plain">  "easycom": {
    "autoscan": false,
    "custom": {
      "mx-(.*)": "@chinapnr/dg-bill-plugin/lib/$1/index.vue"
    }
  }
</pre><p></p><h4><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">在 /src/App.vue 中添加组件样式</span></h4><pre data-language="plain">@import '@chinapnr/dg-bill-plugin/lib/styles/matrix.scss';
</pre><p></p><h4><span style="background-color:rgb(255, 255, 255);color:rgb(31, 35, 40)">在 /src/pages 文件夹内的任意 vue 文件中，直接使用组件库标签</span></h4><pre data-language="plain">&lt;template&gt;
  &lt;mx-bill-notice&gt;缴费公告&lt;/mx-bill-notice&gt;
&lt;/template&gt;
</pre><p></p><p></p>]]></description><link>https://paas.huifu.com/bbs/topic/27/汇付支付斗拱线下账单支付-vue-组件库-dg-bill-plugin</link><generator>RSS for Node</generator><lastBuildDate>Sun, 20 Sep 2026 16:09:18 GMT</lastBuildDate><atom:link href="https://paas.huifu.com/bbs/topic/27.rss" rel="self" type="application/rss+xml"/><pubDate>Wed, 13 May 2026 08:46:26 GMT</pubDate><ttl>60</ttl></channel></rss>