React 生成二维码/条形码

最 新:https://www.zybuluo.com/c-Ku/note/970696

一、生成二维码

只需引入 qrcode.react 插件即可

import * as QrCode from 'qrcode.react'

render() {
    return (
        <QrCode value={value} size={120} />
    )
}

二、生成条形码

需引入 jsbarcode 插件

import * as Barcode from 'jsbarcode'

export class RefundSheet extends React.Component<any> {
  barcode
  componentDidMount() {
    Barcode(this.barcode, value, {
      displayValue: false,
      width: 1,
      height: 35,
      margin: 0,
    })
  }
  render() {
    return (
      <div className="barcode-box">
        <svg
          ref={ref => {
            this.barcode = ref
          }}
        />
      </div>
    )
  }
}
.barcode-box {
    width: 100%;
    position: relative;
    svg {
        position: absolute;
        right: 0px;
    }
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容