如果需要对当前页面转发进行自定义编辑,则需要再当前页面 Page 中定义 官方相关文档转发 · 小程序 痛点使用原生微信转发主要有以下痛点:wx.showShareMenu()
format
举个例子在每次分享的卡片的链接上,都需要带上当前分享用户的 解决方式利用 代码分享分享修饰器withShare.jsimport Taro from '@tarojs/taro';
import { connect } from '@tarojs/redux';
import defaultShareImg from 'xxx.jpg';
function withShare(opts = {}) {
// 设置默认
const defalutPath = 'pages/index/index?';
const defalutTitle = '默认标题';
const defaultImageUrl = defaultShareImg;
return function demoComponent(Component) {
// redux里面的用户数据
@connect(({ user }) => ({
userInfo: user.userInfo
}))
class WithShare extends Component {
async componentWillMount() {
wx.showShareMenu({
withShareTicket: true
});
if (super.componentWillMount) {
super.componentWillMount();
}
}
// 点击分享的那一刻会进行调用
onShareAppMessage() {
const { userInfo } = this.props;
let { title, imageUrl, path = null } = opts;
// 从继承的组件获取配置
if (this.$setSharePath && typeof this.$setSharePath === 'function') {
path = this.$setSharePath();
}
// 从继承的组件获取配置
if (this.$setShareTitle && typeof this.$setShareTitle === 'function') {
title = this.$setShareTitle();
}
// 从继承的组件获取配置
if (
this.$setShareImageUrl &&
typeof this.$setShareImageUrl === 'function'
) {
imageUrl = this.$setShareImageUrl();
}
if (!path) {
path = defalutPath;
}
// 每条分享都补充用户的分享id
// 如果path不带参数,分享出去后解析的params里面会带一个{'': ''}
const sharePath = `${path}&shareFromUser=${userInfo.shareId}`;
return {
title: title || defalutTitle,
path: sharePath,
imageUrl: imageUrl || defaultImageUrl
};
}
render() {
return super.render();
}
}
return WithShare;
};
}
export default withShare;
复制代码
使用的页面pages/xxx/xxx.jsimport Taro, { Component } from '@tarojs/taro';
import { connect } from '@tarojs/redux';
import { View } from '@tarojs/components';
import withShare from './withShare';
@withShare({
title: '可设置分享标题',
imageUrl: '可设置分享图片路径',
path: '可设置分享路径'
})
class Index extends Component {
// $setSharePath = () => '可设置分享路径(优先级最高)'
// $setShareTitle = () => '可设置分享标题(优先级最高)'
// $setShareImageUrl = () => '可设置分享图片路径(优先级最高)'
render() {
return <View />
}
}
复制代码
由于是继承传入的组件,所以获取分享配置除了可以从函数的参数获取,还可以通过定义的一些方法,通过继承的组件获取到继承的参数,这样可以再某些业务场景下,根据需要动态生成分享参数配置,例如代码里面的 |
温馨提示:这篇文章没有解决您的问题?欢迎添加微信:18948083295,有微信小程序专业人员,保证有问必答。转载本站文章请注明转自http://www.okeydown.com/(微信小程序网)。
- 微信扫描二维码关注官方微信
- ▲长按图片识别二维码