国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

React JsBarcode使用

wangxinarhat / 3371人閱讀

摘要:瞎扯百度搜了一下發現很多教怎么用的就是沒有封裝組件的實際這個東西用起來還是很簡單的今天正好封裝了個組件今天算是寫的第三個月了還是比較好上手的幾種應用這種是的明顯不是想要的略過這種用找的方法感覺不好這種有點不明白看起來也不是想要的

瞎扯

百度,google搜了一下,發現很多教怎么用的,就是沒有封裝組件的.

實際這個東西,用起來還是很簡單的.

今天正好封裝了個組件.

今天算是寫react的第三個月了.react還是比較好上手的.

JsBarcode

幾種應用:

這種是JQuery的.明顯不是想要的,略過


這種用classname找的方法.感覺不好.


這種有點不明白.看起來也不是想要的.


最后這個才像是需要的.

封裝
/**
 * 簡單生成條形碼
 * {
 * width: 2,//較細處條形碼的寬度
 * height: 100, //條形碼的寬度,無高度直接設置項,由位數決定,可以通過CSS去調整,見下
 * quite: 10,
 * format: "CODE128",
 * displayValue: false,//是否在條形碼下方顯示文字
 * font:"monospace",
 * textAlign:"center",
 * fontSize: 12,
 * backgroundColor:"",
 * lineColor:"#000"//條形碼顏色
 * }
 */
class SimpleBarcode extends Component {
    componentDidMount() {
        this.createBarcode();
    }

    componentWillReceiveProps(nextProps) {
        if (this.props !== nextProps) {
            this.createBarcode();
        }
    }

    createBarcode = () => {
        if (!this.barcode) return;
        const {
            width = 1, height = 35, margin = 0, label, displayValue = true,
        } = this.props;
        if (!label) {
            return;
        }
        Barcode(this.barcode, label, {
            displayValue, // 是否由Barcode顯示二維碼下面的值
            width, // 每條線的寬度
            height, // 高度
            margin, //邊距
        });
    };

    render() {
        const {
            labelClassName, label, labelStyle, className, style, displayValue = true,
        } = this.props;
        return (
            
{ this.barcode = ref; }} /> {displayValue ");
簡單使用
   "45"
        width="1"//這里只能是大于1的整數
    />

期待你的評論,點贊

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/6928.html

相關文章

  • React 328道最全面試題(持續更新)

    摘要:希望大家在這浮夸的前端圈里,保持冷靜,堅持每天花分鐘來學習與思考。 今天的React題沒有太多的故事…… 半個月前出了248個Vue的知識點,受到很多朋友的關注,都強烈要求再出多些React相前的面試題,受到大家的邀請,我又找了20多個React的使用者,他們給出了328道React的面試題,由我整理好發給大家,同時發布在了前端面試每日3+1的React專題,希望對大家有所幫助,同時大...

    kumfo 評論0 收藏0
  • React 深入系列1:React 中的元素、組件、實例和節點

    摘要:中的元素組件實例和節點,是中關系密切的個概念,也是很容易讓初學者迷惑的個概念。組件和元素關系密切,組件最核心的作用是返回元素。只有組件實例化后,每一個組件實例才有了自己的和,才持有對它的節點和子組件實例的引用。 React 深入系列,深入講解了React中的重點概念、特性和模式等,旨在幫助大家加深對React的理解,以及在項目中更加靈活地使用React。 React 中的元素、組件、實...

    LeviDing 評論0 收藏0
  • React 深入系列1:React 中的元素、組件、實例和節點

    摘要:中的元素組件實例和節點,是中關系密切的個概念,也是很容易讓初學者迷惑的個概念。組件和元素關系密切,組件最核心的作用是返回元素。只有組件實例化后,每一個組件實例才有了自己的和,才持有對它的節點和子組件實例的引用。 文:徐超,《React進階之路》作者授權發布,轉載請注明作者及出處 React 深入系列,深入講解了React中的重點概念、特性和模式等,旨在幫助大家加深對React的理解...

    techstay 評論0 收藏0
  • 學習React之前你需要知道的的JavaScript基礎知識

    摘要:和類在開始時遇到類組件,只是需要有關類的基礎。畢竟,中的條件呈現僅再次顯示大多數是而不是特定的任何內容。 在我的研討會期間,更多的材料是關于JavaScript而不是React。其中大部分歸結為JavaScript ES6以及功能和語法,但也包括三元運算符,語言中的簡寫版本,此對象,JavaScript內置函數(map,reduce,filter)或更常識性的概念,如:可組合性,可重用...

    bitkylin 評論0 收藏0

發表評論

0條評論

wangxinarhat

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<