Taro 小程序实现分享二维码图片功能代码

以下是基于 Taro 小程序实现分享二维码图片功能的代码：

1. 引入依赖

import Taro from '@tarojs/taro'
import { Canvas } from '@tarojs/components'
import QRCode from 'qrcode'

2. 定义组件

class QrcodeCanvas extends Component {
  canvasId = 'canvas'

  async componentDidMount() {
    const { url } = this.props
    const ctx = Taro.createCanvasContext(this.canvasId, this.$scope)

    const qrcode = await QRCode.toDataURL(url)
    const img = await Taro.getImageInfo({ src: qrcode })

    ctx.drawImage(img.path, 0, 0, 200, 200)
    ctx.draw(false, () => {
      Taro.canvasToTempFilePath({
        x: 0,
        y: 0,
        width: 200,
        height: 200,
        destWidth: 200,
        destHeight: 200,
        canvasId: this.canvasId,
        success: (res) => {
          this.props.onSuccess && this.props.onSuccess(res.tempFilePath)
        },
        fail: (err) => {
          this.props.onFail && this.props.onFail(err)
        }
      }, this.$scope)
    })
  }

  render() {
    return (
      <Canvas canvasId={this.canvasId} style={{ width: '200px', height: '200px' }} />
    )
  }
}

3. 使用组件

class Index extends Component {
  handleShare = async () => {
    const { url } = this.props
    try {
      const res = await Taro.canvasToTempFilePath({
        x: 0,
        y: 0,
        width: 200,
        height: 200,
        destWidth: 200,
        destHeight: 200,
        fileType: 'jpg',
        canvasId: 'canvas',
      }, this.$scope)

      await Taro.saveImageToPhotosAlbum({ filePath: res.tempFilePath })
      Taro.showToast({ title: '保存成功' })
    } catch (err) {
      console.log(err)
    }
  }

  render() {
    return (
      <View>
        <QrcodeCanvas url={this.props.url} onSuccess={(path) => {
          this.sharePath = path
        }} />
        <Button onClick={this.handleShare}>分享</Button>
      </View>
    )
  }
}

以上代码实现了一个简单的小程序二维码分享功能，当用户点击分享按钮时，会将二维码图片保存到相册中。如果需要在其他场景中使用，可以根据具体需求进行修改。