react-native中生成二维码和分享图片

最新推荐文章于 2024-07-28 19:32:53 发布

疯狂紫萧

最新推荐文章于 2024-07-28 19:32:53 发布

阅读量1.4k

点赞数 1

分类专栏： react-native 文章标签： react-native qrcode 快照

本文链接：https://blog.csdn.net/cuo9958/article/details/84850894

版权

本文介绍了如何在react-native项目中不使用原生代码生成二维码，依赖qrcode.js库并通过WebView组件展示。同时，文章还探讨了如何利用React-Native的组件快照功能生成和保存组件截图，实现客户端自定义分享图片，提高用户体验和效率。

摘要由CSDN通过智能技术生成

在react-native中展示二维码是一个非常麻烦的过程。

最好的方法莫过于原生支持画二维码。但是这有一个副作用，需要在原生中添加新的代码。对于不打算很快升级的项目是一个很通过的选择。

这里我介绍一种不使用原生的方式来生成二维码，副作用仅仅是需要联网下载一个js文件。当然可以使用本地缓存了，这样就和原生几乎一致了。

不添加原生代码的情况下实现react-native中展示二维码，其实利用的正是WebView组件。

在前端开发的过程中已经有大神实现了js生成二维码的功能。它就是qrcode.js，熟悉的人已经可以很快想到实现方式了。

如果将WebView看做一个类似View的组件，那么在WebView加载完成之后它就已经在展现上与普通组件没有什么区别了。在这个时候就可以看做已经完成了二维码的生成。

<WebView
    automaticallyAdjustContentInsets={
   false}
    scalesPageToFit={
   Platform.OS === 'android'}
    contentInset={

关注