首页 注册 登录
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
› React
广告
ciaochaos
V2EX  ›  React

前端实现艺术二维码生成～

  ciaochaos ·
ciaochaos · 2020 年 5 月 27 日 · 43002 次点击
这是一个创建于 2067 天前的主题，其中的信息可能已经有所发展或是发生改变。

用 React 做了一个二维码生成器，欢迎来玩！

Github 仓库
github.com/ciaochaos/qrbtf

访问网站
qrbtf.com

图文介绍

第 1 条附言  ·  2020 年 6 月 6 日
C2 样式操作演示视频来啦！
b23.tv/CxkcTU
第 2 条附言  ·  2020 年 6 月 11 日

！！！

你们要的 React 库来啦

Github
github.com/cpunisher/react-qrbtf

安装

npm install react-qrbtf --save
第 3 条附言  ·  2020 年 6 月 28 日
我们的二维码生成 API 开始测试啦！

https://www.yuque.com/qrbtf/docs/api

http://api.qrbtf.com/qrcode?data=https://qrbtf.com&level=M&style=base&type=round&size=50&opacity=30&posType=planet&otherColor=%23000000&posColor=%23000000
  • 二维码
  • 生成器
  • GitHub
  • React
    167 条回复  •  2020-09-03 12:34:38 +08:00
    1  2  
    ❮ ❯
    guanhui07
        101
    guanhui07  
       2020 年 6 月 19 日   ❤️ 1
    可以可以
    robinlovemaggie
        102
    robinlovemaggie  
       2020 年 6 月 19 日   ❤️ 1
    @ciaochaos 99 常年用 VX 大扫除
    ciaochaos
        103
    ciaochaos  
    OP
       2020 年 6 月 19 日
    @robinlovemaggie 哈哈可能是背景图的问题？ C2 可以不
    robinlovemaggie
        104
    robinlovemaggie  
       2020 年 6 月 19 日
    @ciaochaos 102 网站 C2 可以
    ciaochaos
        105
    ciaochaos  
    OP
       2020 年 6 月 19 日
    @robinlovemaggie OK 了解了
    ciaochaos
        106
    ciaochaos  
    OP
       2020 年 6 月 21 日
    新样式发布！ A — a1

    浏览图：i.v2ex.co/Eypg4rIh.jpeg
    ciaochaos
        107
    ciaochaos  
    OP
       2020 年 6 月 22 日
    新样式发布！ A — b1 、A — b2
    ciaochaos
        108
    ciaochaos  
    OP
       2020 年 6 月 22 日 via iPhone
    @hlayk @violetlai Shift 已经改为拖拽啦
    mtmzorro
        109
    mtmzorro  
       2020 年 6 月 24 日   ❤️ 1
    漂亮那 赞个 star
    ciaochaos
        110
    ciaochaos  
    OP
       2020 年 6 月 24 日
    @mtmzorro 开心～
    vissssa
        111
    vissssa  
       2020 年 6 月 24 日   ❤️ 1
    好看，点赞
    ciaochaos
        112
    ciaochaos  
    OP
       2020 年 6 月 24 日
    @vissssa 最近又加了一波新样式，一起来写哈哈
    QMore
        113
    QMore  
       2020 年 6 月 24 日
    用过这个 https://cli.im/
    ciaochaos
        114
    ciaochaos  
    OP
       2020 年 6 月 24 日
    @QMore Yes，他们的产品经理告诉我草料刚刚换上了新的美化器，快去试试吧～
    vincent321
        115
    vincent321  
       2020 年 6 月 24 日   ❤️ 1
    秀儿 为什么你可以这么优秀。换 QR CODE 走起
    ciaochaos
        116
    ciaochaos  
    OP
       2020 年 6 月 24 日
    @vincent321 哈哈哈哈哈换吧换吧！
    AoTmmy
        117
    AoTmmy  
       2020 年 6 月 24 日   ❤️ 1
    提个小建议，输入网址后自动生成二维码，这样方便多了
    参考 https://www.the-qrcode-generator.com/
    ciaochaos
        118
    ciaochaos  
    OP
       2020 年 6 月 25 日
    @AoTmmy 嗯嗯！这样当然是最爽的哈哈，代码改动量也不会超过一行（ onblur vs. onchange ），但是我们考虑到某些二维码样式会有比较大的运算量，onchange 会出现比较糟糕的延时，就弃用了。尤其是当 URL 特别长的时候，生成速度就会……肉眼可见的慢。
    ciaochaos
        119
    ciaochaos  
    OP
       2020 年 6 月 26 日 via iPhone
    ![]( )
    smileherd
        120
    smileherd  
       2020 年 6 月 26 日   ❤️ 1
    赞！很棒！
    ciaochaos
        121
    ciaochaos  
    OP
       2020 年 6 月 26 日
    @smileherd ✌️
    MzM2ODkx
        122
    MzM2ODkx  
       2020 年 6 月 26 日   ❤️ 1
    赞
    linvaux
        123
    linvaux  
       2020 年 6 月 26 日   ❤️ 1
    挺有意思的，已 star
    MaxSoloware
        124
    MaxSoloware  
       2020 年 6 月 26 日   ❤️ 1
    牛逼牛逼
    ciaochaos
        125
    ciaochaos  
    OP
       2020 年 6 月 26 日
    @iMusic @linvaux @fengyiqicoder 嘻嘻谢谢！
    poorcai
        126
    poorcai  
       2020 年 6 月 26 日
    可以生成微信二维码吗？
    ciaochaos
        127
    ciaochaos  
    OP
       2020 年 6 月 26 日 via iPhone
    @poorcai 嗯嗯可以的
    MomoS
        128
    MomoS  
       2020 年 6 月 27 日 via Android   ❤️ 1
    好漂亮啊，啧啧啧
    ciaochaos
        129
    ciaochaos  
    OP
       2020 年 6 月 27 日 via iPhone
    @MomoS ✊🏻
    janda
        130
    janda  
       2020 年 6 月 28 日
    为什么这里面的所有字都是绿色的？其它主题的就是默认的？
    ciaochaos
        131
    ciaochaos  
    OP
       2020 年 6 月 28 日
    @janda 哈？你是说 V2EX NodeJS 的 CSS 配色吗
    janda
        132
    janda  
       2020 年 6 月 28 日
    @ciaochaos 是的、至少这个主题是这样的
    ciaochaos
        133
    ciaochaos  
    OP
       2020 年 6 月 28 日
    @janda 哈哈哈哈是了，我也没办法 😂
    kajweb
        134
    kajweb  
       2020 年 6 月 30 日
    支持 微信小程序码吗？
    ciaochaos
        135
    ciaochaos  
    OP
       2020 年 6 月 30 日
    @kajweb 之前有位朋友写了一个不需要依赖和框架的版本，看这里 👉 https://github.com/ciaochaos/qrbtf/issues/8
    Dashy
        136
    Dashy  
       2020 年 7 月 2 日   ❤️ 1
    star +1
    ciaochaos
        137
    ciaochaos  
    OP
       2020 年 7 月 2 日 via iPhone
    @Dashy 🌟
    amwyyyy
        138
    amwyyyy  
       2020 年 7 月 2 日   ❤️ 1
    有点意思
    ciaochaos
        139
    ciaochaos  
    OP
       2020 年 7 月 2 日
    @amwyyyy 😉
    sparrow02
        140
    sparrow02  
       2020 年 7 月 2 日   ❤️ 1
    很有趣，star ！
    ciaochaos
        141
    ciaochaos  
    OP
       2020 年 7 月 2 日 via iPhone
    @sparrow02 谢谢！
    ae
        142
    ae  
       2020 年 7 月 4 日   ❤️ 1
    很不错
    ciaochaos
        143
    ciaochaos  
    OP
       2020 年 7 月 4 日 via iPhone
    @ae ✊🏻
    mopengiio
        144
    mopengiio  
       2020 年 7 月 6 日   ❤️ 1
    奈斯啊老哥
    ciaochaos
        145
    ciaochaos  
    OP
       2020 年 7 月 7 日 via iPhone
    @mopengiio 耶！
    patrick961214
        146
    patrick961214  
       2020 年 7 月 8 日   ❤️ 1
    赞 b(￣▽￣)d
    brader
        147
    brader  
       2020 年 7 月 9 日   ❤️ 1
    请问作者，你这个生成的二维码，我放到各个二维码解析网站，都显示解析不了，但是实际扫码又是能正常使用的，是什么问题？
    其他网站生成的二维码，能正常解析的。
    ciaochaos
        148
    ciaochaos  
    OP
       2020 年 7 月 9 日 via iPhone
    @patrick961214 ✌🏻
    ciaochaos
        149
    ciaochaos  
    OP
       2020 年 7 月 9 日 via iPhone
    @brader 因为微信的识别引擎太优秀了哈哈，一般的扫描工具，尤其是前端，都做不到这么高的识别效率和容错。
    dox1994
        150
    dox1994  
       2020 年 7 月 9 日   ❤️ 1
    已 star，网站 ui 好漂亮，ui 是用什么做的呀
    ciaochaos
        151
    ciaochaos  
    OP
       2020 年 7 月 10 日
    @dox1994 是我自己用 CSS 写的～没有用 UI 库
    HangoX
        152
    HangoX  
       2020 年 8 月 4 日   ❤️ 1
    非常赞！！！
    vertigo
        153
    vertigo  
       2020 年 8 月 4 日   ❤️ 1
    nice!
    ciaochaos
        154
    ciaochaos  
    OP
       2020 年 8 月 4 日
    @vertigo ✌🏻
    ciaochaos
        155
    ciaochaos  
    OP
       2020 年 8 月 4 日
    @HangoX thx ！
    zjf
        156
    zjf  
       2020 年 8 月 5 日   ❤️ 1
    太帅了
    ciaochaos
        157
    ciaochaos  
    OP
       2020 年 8 月 5 日 via iPhone
    @zjf 👏🏻
    Hallujah
        158
    Hallujah  
       2020 年 8 月 6 日   ❤️ 1
    好看，帮顶一个
    ciaochaos
        159
    ciaochaos  
    OP
       2020 年 8 月 6 日
    @Hallujah 谢谢～
    lijie0981
        160
    lijie0981  
       2020 年 8 月 11 日   ❤️ 1
    很棒！
    ciaochaos
        161
    ciaochaos  
    OP
       2020 年 8 月 11 日
    @lijie0981 😉
    palmers
        162
    palmers  
       2020 年 8 月 12 日   ❤️ 1
    非常优秀!
    ciaochaos
        163
    ciaochaos  
    OP
       2020 年 8 月 12 日
    @palmers 🙌🏻
    Handle
        164
    Handle  
       2020 年 8 月 21 日   ❤️ 1
    我们是两位大一的学生，太可怕了
    IssacTomatoTan
        165
    IssacTomatoTan  
       2020 年 8 月 21 日 via Android   ❤️ 1
    那个人很厉害
    ciaochaos
        166
    ciaochaos  
    OP
       2020 年 8 月 25 日
    @Handle 😂😂😂
    machunning9843
        167
    machunning9843  
       2020 年 9 月 3 日
    很强，点赞！
    1  2  
    ❮ ❯
    关于   ·   帮助文档   ·   自助推广系统   ·   博客   ·   API   ·   FAQ   ·   Solana   ·   4971 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 45ms · UTC 09:37 · PVG 17:37 · LAX 01:37 · JFK 04:37
    ♥ Do have faith in what you're doing.