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

[ciaochaos]

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

Github 仓库
github.com/ciaochaos/qrbtf

访问网站
qrbtf.com

图文介绍

• 如何制作一个漂亮的二维码
  urlify.cn/qUfaMb
• QRBTF 开源啦！来写个二维码样式吧～
  urlify.cn/VBNVVb

C2 样式操作演示视频来啦！
b23.tv/CxkcTU

！！！

你们要的 React 库来啦

Github
github.com/cpunisher/react-qrbtf

安装

npm install react-qrbtf --save

我们的二维码生成 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

[guanhui07]

可以可以

[robinlovemaggie]

@ciaochaos 99 常年用 VX 大扫除

[ciaochaos]

@robinlovemaggie 哈哈可能是背景图的问题？ C2 可以不

[robinlovemaggie]

@ciaochaos 102 网站 C2 可以

[ciaochaos]

@robinlovemaggie OK 了解了

[ciaochaos]

新样式发布！ A — a1

浏览图：i.v2ex.co/Eypg4rIh.jpeg

[ciaochaos]

新样式发布！ A — b1 、A — b2

[ciaochaos]

@hlayk @violetlai Shift 已经改为拖拽啦

[mtmzorro]

漂亮那 赞个 star

[ciaochaos]

@mtmzorro 开心～

[vissssa]

好看，点赞

[ciaochaos]

@vissssa 最近又加了一波新样式，一起来写哈哈

[QMore]

用过这个 https://cli.im/

[ciaochaos]

@QMore Yes，他们的产品经理告诉我草料刚刚换上了新的美化器，快去试试吧～

[vincent321]

秀儿 为什么你可以这么优秀。换 QR CODE 走起

[ciaochaos]

@vincent321 哈哈哈哈哈换吧换吧！

[AoTmmy]

提个小建议，输入网址后自动生成二维码，这样方便多了
参考 https://www.the-qrcode-generator.com/

[ciaochaos]

@AoTmmy 嗯嗯！这样当然是最爽的哈哈，代码改动量也不会超过一行（ onblur vs. onchange ），但是我们考虑到某些二维码样式会有比较大的运算量，onchange 会出现比较糟糕的延时，就弃用了。尤其是当 URL 特别长的时候，生成速度就会……肉眼可见的慢。

[ciaochaos]


[smileherd]

赞！很棒！

[ciaochaos]

@smileherd ✌️

[MzM2ODkx]

赞

[linvaux]

挺有意思的，已 star

[MaxSoloware]

牛逼牛逼

[ciaochaos]

@iMusic @linvaux @fengyiqicoder 嘻嘻谢谢！

[bytewalk]

可以生成微信二维码吗？

[ciaochaos]

@poorcai 嗯嗯可以的

[MomoS]

好漂亮啊，啧啧啧

[ciaochaos]

@MomoS ✊🏻

[janda]

为什么这里面的所有字都是绿色的？其它主题的就是默认的？

[ciaochaos]

@janda 哈？你是说 V2EX NodeJS 的 CSS 配色吗

[janda]

@ciaochaos 是的、至少这个主题是这样的

[ciaochaos]

@janda 哈哈哈哈是了，我也没办法 😂

[kajweb]

支持 微信小程序码吗？

[ciaochaos]

@kajweb 之前有位朋友写了一个不需要依赖和框架的版本，看这里 👉 https://github.com/ciaochaos/qrbtf/issues/8

[Dashy]

star +1

[ciaochaos]

@Dashy 🌟

[amwyyyy]

有点意思

[ciaochaos]

@amwyyyy 😉

[sparrow02]

很有趣，star ！

[ciaochaos]

@sparrow02 谢谢！

[ae]

很不错

[ciaochaos]

@ae ✊🏻

[mopengiio]

奈斯啊老哥

[ciaochaos]

@mopengiio 耶！

[patrick961214]

赞 b(￣▽￣)d

[brader]

请问作者，你这个生成的二维码，我放到各个二维码解析网站，都显示解析不了，但是实际扫码又是能正常使用的，是什么问题？
其他网站生成的二维码，能正常解析的。

[ciaochaos]

@patrick961214 ✌🏻

[ciaochaos]

@brader 因为微信的识别引擎太优秀了哈哈，一般的扫描工具，尤其是前端，都做不到这么高的识别效率和容错。

[cedarwood]

已 star，网站 ui 好漂亮，ui 是用什么做的呀

[ciaochaos]

@dox1994 是我自己用 CSS 写的～没有用 UI 库

[HangoX]

非常赞！！！

[vertigo]

nice!

[ciaochaos]

@vertigo ✌🏻

[ciaochaos]

@HangoX thx ！

[zjf]

太帅了

[ciaochaos]

@zjf 👏🏻

[Hallujah]

好看，帮顶一个

[ciaochaos]

@Hallujah 谢谢～

[lijie0981]

很棒！

[ciaochaos]

@lijie0981 😉

[palmers]

非常优秀!

[ciaochaos]

@palmers 🙌🏻

[Handle]

我们是两位大一的学生，太可怕了

[IssacTomatoTan]

那个人很厉害

[ciaochaos]

@Handle 😂😂😂

[machunning9843]

很强，点赞！