JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1
  • Score
    100M100P100Q43088F
  • License MIT

链接预览二维码及相关操作整合

Package Exports

  • @gdyfe/btn-qrcode
  • @gdyfe/btn-qrcode/dist/btnqrcode.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@gdyfe/btn-qrcode) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@gdyfe/btn-qrcode

Installation

yarn add @gdyfe/btn-qrcode
npm install --save @gdyfe/btn-qrcode

Usage

import BtnQRCode from '@gdyfe/btn-qrcode'
// 自定义属性data-btnqrcode存放url
<button data-btnqrcode="https://www.baidu.com">预览</button>
const btnqrcode = new BtnQRCode(options)
// 数据更新时调用(如页码更新dom需重新调用)
btnqrcode.init()

Options

const btnqrcode = new BtnQRCode({
  openUrlText: '打开链接', // 选填,设置打开链接按钮与文字
  openUrlType: 'default', // 选填,打开按钮样式,(success/ghost/<默认值>default)
  copyUrlText: '一键复制', // 选填,设置复制链接按钮与文字
  copyUrlType: 'default', // 选填,复制按钮样式,(success/ghost/<默认值>default)
  urlTextPosTB: 'bottom', // 选填,打开与复制按钮位于二维码方位,(top/<默认值>bottom)
  urlTextPosLR: 'between', // 选填,打开与复制按钮排版格式,(around/left/right/center/<默认值>between)
  noticeText: '提示语句', // 选填,提示语句
  noticeTextColor: '#666', // 选填,提示语句颜色设置
  isShowInput: true, // 选填,是否显示input输入框
  boundaryDom: '.content' // 选填,是否指定定位边界dom元素选择器
  placement: 'bottom' //选填,默认bottom
})

btnqrcode.onCopy = () => {
  // 复制完成时自定义操作,如复制成功通知
}