WeChat ミニプログラム カスタム共有機能 開発ノート

1. 共有ページでonShareAppMessage メソッドを定義するには、このイベント ハンドラーが定義されている場合のみ、右上のメニューに [進む] ボタンが表示されます。

2. onShareAppMessage をトリガーするには 2 つの方法があります。1 つは下の例のボタンによってトリガーされ、もう 1 つは右上隅のメニューによって転送されます。

3. onShareAppMessage は同期メソッドです. 複雑な転送ロジックをカスタマイズしたい場合, そのpromiseメソッドを介して実装する必要があります. 使用方法は次のとおりです.

4. promiseメソッドを使用して転送コンテンツを定義する場合は、他の基本的な構成項目も定義する必要があります. promise パラメータが存在する場合, その解決結果が優先されます. 3 秒以内に解決されない場合, 共有はデフォルトのパラメータを使用します.

<button class="resetBtn mangeL-box" open-type="share" data-info='{
   
   {videoInfo}}'>
    <view class="icon-name">分享</view>
</button>

 

   onShareAppMessage({from,target}) {
        // 判断from类型来确定是按钮分享还是三个点分享
        if (from == 'button') {
            let video = target.dataset.info
            const promise = new Promise(resolve => {
                this.creatShare(video).then(res => {
                    resolve(res)
                })
            })
            
            return {
                title: '请欣赏我的课文朗读作品，点赞+评论。',
                path: `/pages/index/index`,
                imageUrl: xxx,
                promise
            }
        } else {
            return {
                title: '课文朗读，从未如此有趣。',
                path: `xxx`,
                imageUrl: 'http://xxx/v3/shareContent.png'
            }
        }
    }

  creatShare(video) {
        return new Promise((resolve, reject) => {
            // 我在这里是使用canvas绘图分享的，绘制代码已删除，主要是通过reslove（）抛出分享的配置项
            wx.canvasToTempFilePath({
                canvas: canvas,
                success(res) {
                    resolve({
                        title: '请欣赏我的课文朗读作品，点赞+评论。',
                        path: `/pages/index/index?readId=${video.userRead.id}`,
                        imageUrl: res.tempFilePath
                    })
                },
                fail(res) {
                    reject()
                }
            }, this)
        })
    },