uniapp WeChat アプレットのグローバル共有とカスタム ページ共有

uniappは、  WeChatアプレットの友人へのグローバル転送/モーメントへの共有機能を実現します。主に Vue.jsのグローバルミックスイン の概念を利用します。

1. プロジェクトのルート ディレクトリに mixins フォルダーを作成し、グローバルに共有される js ファイルを作成します。ミックスイン/share.js 

export default {
	data() {
		return {
			share: {
				title: '页面分享的标题',
				path: '/pages/index/index',
				imageUrl: '/static/imgs/share_img.png' // 全局分享的图片(可本地可网络)
			}
		}
	},
	onLoad() {

	},
	onShareAppMessage(res) { //发送给朋友
		return this.share
	},
	onShareTimeline(res) { //分享到朋友圈
		return this.share
	}

}

2. プロジェクトの main.js ファイルに share.js ファイルを導入し、Vue.mixin() メソッドを使用してグローバルに混合します。

// 导入并挂载全局的分享方法
import share from '@/mixins/share.js'
Vue.mixin(share)

3. カスタムページ共有、

(1) 方法 1: onShareAppMessage()メソッド と onShareTimeline() メソッドを使用して共有コンテンツをカスタマイズすると、グローバル共有コンテンツがページで定義された共有コンテンツによって上書きされます。共有ボタンへのバインドに適しています。

export default {
    onLoad() {

	},

    onShow() {

	},
 
    // 自定义此页面的转发给好友(已经有全局的分享方法，此处会覆盖全局)
	onShareAppMessage(res) {
	    return {
	      title: '页面分享的标题',
	      path: '/pages/home/home',
		  imageUrl: '/static/imgs/share.png'
	    }
	},


	// 自定义页面的分享到朋友圈
	onShareTimeline(res) {
		return {
			title: '页面分享的标题',
			path: '/pages/home/home',
			imageUrl: '/static/imgs/share.png'
		}
	}
}

(2) 方法2：ページデータのシェアデータを直接変更して世界シェアをカバーする

export default {
    data() {
		return {
            share: {
				title: '自定义分享标题',
				path: '/activity/index/index',
				imageUrl: '/static/imgs/share_img.png'
			},
         }
    
    }    
}