小程序如何生成二维码海报?

浅浅的花香味﹌ 2022-12-13 14:27 624阅读 0赞

在小程序开发完成之后,我们会时常遇到这样的一个问题,小程序该怎么推广,增加曝光量,让更多的人看到?我们都知道,小程序推广一般是给小程序增加一个分享的功能,可以分享到群里面。

但是不能发朋友圈,若是想发到朋友圈,采取的办法是一件生成海报,这样就产生了一个需求了,那就是小程序生成二维码海报的要求。如果是自己写的话,那肯定是要花费一番精力,这个时候要是有一款开源组件直接用那就好了,这不,我们的程序员小哥哥已经将自己的宝贵的源码开源出来了,笔芯~

wxa-plugin-canvas 是一个生成二维码海报的组件,通过非常简单的配置就可以生成精美的海报。反正大家知道这个开源库非常好用就行了。

开源项目地址:https://github.com/jasondu/wxa-plugin-canvas

开源项目作者:jason

效果图如下:

12b3edec6f262d7445f97485af6d8989.png

安装

方式一.通过 npm 安装 (推荐)

小程序已经支持使用 npm 安装第三方包,详见 npm 支持

  1. # npm
  2. npm i wxa-plugin-canvas -S --production
  3. # yarn
  4. yarn add wxa-plugin-canvas --production

方式二.下载代码

直接通过 git 下载 wxa-plugin-canvas 源代码,并将miniprogram_dist目录拷贝到自己的项目组件目录中

#

使用组件

  1. {
  2. "usingComponents": {
  3. "poster": "wxa-plugin-canvas/poster",
  4. }
  5. }

接着就可以在 wxml 中直接使用组件

  1. <poster id="poster" config="{
  2. {posterConfig}}" bind:success="onPosterSuccess" bind:fail="onPosterFail">
  3. <button>点击生成海报</button>
  4. </poster>

以上便是今日分享,觉得内容不错的,还请点个「在看」支持,谢谢各位。

推荐阅读:

太牛了,推荐一份从 0 开始刷 LeetCode 的心得记录

22 个让 React 开发更高效更有趣的工具

一文读懂 JS 装饰器,这是一个会打扮的装饰器

好用到叫出声!强烈推荐 10 款 Mac 软件!

JSON.stringify() 的 5 个秘密特性

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDc2MzU2OQ_size_16_color_FFFFFF_t_70

发表评论

表情:
评论列表 (有 0 条评论,624人围观)

还没有评论,来说两句吧...

相关阅读

    相关 程序生成海报

    在小程序开发完成之后,我们会时常遇到这样的一个问题,小程序该怎么推广,增加曝光量,让更多的人看到?我们都知道,小程序推广一般是给小程序增加一个分享的功能,可以分享到群里面。