import React from 'react';
import JsBarcode from 'jsbarcode'; export class RefundSheet extends React.Component {
constructor(props) {
super(props);
this.state = {
value: props.barCode, //由父组件传入用来生成条形码的字符串“barCode”
};
}
componentDidMount() {
  // 调用 JsBarcode方法生成条形码
JsBarcode(this.barcode, this.state.value, {
displayValue: false,
width: 1.5,
height: 50,
margin: 0,
});
} render() {
return (
<div className="barcode-box">
<svg
ref={(ref) => {
this.barcode = ref;
}}
/>
</div>
);
}
}
export default RefundSheet;//导出组件

react 中使用 JsBarcode 显示条形码的更多相关文章

  1. react中引入图片路劲正确但是页面上不显示或者打包后不能正常显示的问题

    一.react中图片引入方式 以前我们用img引入图片只需要如下即可,在react中这样写会报错: <img src="../assets/zzsc1.png" /> ...

  2. 【原】React中,map出来的元素添加事件无法使用

    在使用react中,经常用到react的map函数,用法和jquery里中的map一样,但是,如果你在每个map出来的元素中添加,你会发觉添加的事件无法关联, 比如,我们很多的评论,我需要在每个评论下 ...

  3. 在React中使用Redux

    这是Webpack+React系列配置过程记录的第六篇.其他内容请参考: 第一篇:使用webpack.babel.react.antdesign配置单页面应用开发环境 第二篇:使用react-rout ...

  4. 在react中实现打印功能

    最近项目中,前端采用react+antd+dva的组合,已经完成了后头管理类系统产品的更新迭代工作. 今天有一个新需求,需要在后台管理系统中实现点击打印完成指定页面的打印功能. 之前也没接触过,只知道 ...

  5. React中props

    今天让我们开启新的篇章好吧,来搞一搞React,以下所有操作都是我个人的一些理解,如果有错吴还请指出,想要看更全的可以去React官网可能一下子好吧 昨天按摩没到位,导致今天身体不太行,撸码千万别苦了 ...

  6. react中的路由模块化

    在vue中,可以将路由单独写在一个配置文件中,便于整理维护,而在前面总结整理的react中,都是直接将路由配置放在需要使用的地方,少数的时候话可以接受,但是当项目做大,这种方式就不再被推荐了,我们再r ...

  7. React中如何优雅的捕捉事件错误

    React中如何优雅的捕捉事件错误 前话 人无完人,所以代码总会出错,出错并不可怕,关键是怎么处理. 我就想问问大家react的错误怎么捕捉呢? 这个时候: 小白:怎么处理? 小白+: ErrorBo ...

  8. 深入理解react中的虚拟DOM、diff算法

    文章结构: React中的虚拟DOM是什么? 虚拟DOM的简单实现(diff算法) 虚拟DOM的内部工作原理 React中的虚拟DOM与Vue中的虚拟DOM比较 React中的虚拟DOM是什么?   ...

  9. react系列(五)在React中使用Redux

    上一篇展示了Redux的基本使用,可以看到Redux非常简单易用,不限于React,也可以在Angular.Vue等框架中使用,只要需要Redux的设计思想的地方,就可以使用它. 这篇主要讲解在Rea ...

随机推荐

  1. 转载:IDEA配置SVN及使用

    转自:https://blog.csdn.net/zwj1030711290/article/details/80687365 1.安装svn客户端 之前用myEcplise只需要插件,现在IDEA需 ...

  2. STM32 入门之 GPIO

    入手STM32有一段时间了,感觉刚入门时很难,无处下手,现在学到了点皮毛,写出来和大家分享一下. 首先,什么叫GPIO?这个问题,答案是我也不知道!至少目前我没有必要知道,我只要知道他其实就是51单片 ...

  3. PHP连接FTP服务的简单实现

    PHP连接FTP服务: <?php class Ftp { private $connect; private $getback; /** * ftp连接信息 * @var array */ p ...

  4. C#-Newtonsoft.Json生成复杂JSON

    官方文档:https://www.newtonsoft.com/json/help/html/SerializeObject.htm 一种方式就可以生成所有的 JSON Collection -> ...

  5. 使用Python的PIL模块来进行图片对比

    使用Python的PIL模块来进行图片对比 在使用google或者baidu搜图的时候会发现有一个图片颜色选项,感觉非常有意思,有人可能会想这肯定是人为的去划分的,呵呵,有这种可能,但是估计人会累死, ...

  6. 开源 NAS 操作系统不完全汇总

    市面上能见到的 NAS 操作系统很多,有如 FreeNAS 这样意气风发的开源免费版,也有完全商业的闭源版本,更有如黑群晖之类的破解版本.NAS 系统的迭代是一个大浪淘沙的过程,活下来的系统在功能上逐 ...

  7. FWT公式一览

    总表 真值表 对应运算 FWT IFWT A=B=0 A≠B A=B=1 左项 右项 左项 右项 0 0 1 & L+R R L-R R 0 1 0 ^ L+R L-R (L+R)/2 (L- ...

  8. str方法

    'capitalize', 'casefold', 'center', 'count', 'encode', 'endswith', 'expandtabs', 'find', 'format', ' ...

  9. luoguP1080 国王游戏 题解(NOIP2012)(贪心+高精)

    luoguP1080 国王游戏 题目 #include<iostream> #include<cstdlib> #include<cstdio> #include& ...

  10. MySQL 基础 20191025

    1.MySQL(绿色软件)的安装后: (老师课件中的) 要设置字符集不然会报 1344 错误码,有两种: 为上面的还有一种为: set names 'utf8'; 2.MySQL管理 创建数据库 CR ...