微信小程序全局配置分享功能

技术栈:Taro+vue3

需求:所有页面均可实现分享转发功能,且指定跳转到统一页面

方法一:

每个页面单独配置分享转发功能

javascript 复制代码
<script setup lang="ts">
import { useShareAppMessage } from '@tarojs/taro'

// 每个vue文件页面配置 enableShareAppMessage
definePageConfig({
  navigationBarTitleText: '首页',
  enableShareAppMessage: true
})

// 使用 useShareAppMessage 钩子来自定义分享内容,并指定跳转路径为首页。
useShareAppMessage((res) => {
  console.log('share', res)
  return {
    title: '欢迎访问我们的小程序', // 自定义分享标题
    path: '/pages/index/index' // 指定跳转到首页
  }
})
</script>

方法二:

进行全局配置

注意: Taro 没有直接提供全局设置分享内容的方法

可以通过覆盖 Taro 的 Page 函数,为每个页面添加全局默认的分享配置。这样,所有页面都会自动具备相同的分享功能,而无需在每个页面单独配置。

javascript 复制代码
// app.ts
const app = createApp({
	//@ts-ignore
	// 先保存原生Page函数
	const originPage = Page
	// @ts-ignore
	// 通过直接赋值方式,覆盖Taro的Page函数
	Page = (pageConfig)=>{
		const globalShareConfig = {
			// 设置全局默认分享
			onShareAppMessage:(res:any) => {
				if(res.from === 'button') {
					console.log(res.target)
				}
				return {
					path: 'pages/index/index'
				}
			}
		}
		// 全局默认的分享配置 globalShareConfig 和页面的原始配置 pageConfig 合并到一个新的对象 newPageConfig
		const newPageConfig = Object.assign({},globalShareConfig,pageConfig)
		// 使用原始Page函数创建页面实例
	  return originPage(newPageConfig);
	}
})
相关推荐
m0_462803881 小时前
名单制签到怎么落地:拆解“仅名单内人员签到“的配置链路与匹配逻辑
微信小程序
Ai-_Man3 小时前
您您这可以把Dola的多个会话比如说。左侧的多个会话一次性导出吗?不是单条会话里面的多次会对话。用AI导出鸭,答案是可以的
开发语言·前端·人工智能·小程序
卓怡学长9 小时前
w192基于springboot“考研情报站”微信小程序设计与实现
java·spring boot·spring·微信小程序·intellij-idea
2601_9499506310 小时前
练题簿小程序的 4 个功能,把学习资料变成题库
人工智能·小程序·刷题·练习·小程序推荐
Mingprime13 小时前
短时冲刺,孤军奋战,压力山大
小程序
Mingprime14 小时前
孤军奋战那一次
小程序
盟道科技14 小时前
电商小程序购物车系统设计:缓存与数据库双写一致性实战
数据库·缓存·小程序
卓怡学长14 小时前
w193基于springboot“乐通黄骅”电动车智能充电服务小程序
java·spring boot·spring·小程序·intellij-idea
扶风ff1 天前
新品知识更新太快?用练题簿在线刷题,安排企业培训的小测与复盘
前端·学习·小程序
Ai-_Man1 天前
您您这可以把Microsofat Copilot的多个会话比如说。左侧的多个会话一次性导出吗?不是单条会话里面的多次会对话。AI导出鸭
javascript·人工智能·ai·小程序·电脑·copilot