uni-app微信分享onShareAppMessage方法return路径中设置的参数设置不成功

uni-app微信分享onShareAppMessage方法return路径中设置的参数设置不成功

问题描述

环境：微信小程序
使用场景：在需要分享的页面使用button open-type="share"组件触发分享事件onShareAppMessage，设置return {}，在onLoad(options){}方法获取options中的参数出现bug。

注意：第一次分享页面，点击分享链接进入时能正确获取options中的id=1参数，但是第二次分享该页面同时在onShareAppMessage方法的return中设置id=2，则在onLoad方法的options中获取id还是1，并不是第二次设置id=2。

请帮忙看下这是不是uni-app的bug。

代码示例

<button open-type="share" class="btn btn-share">我也想分享助力</button>  

onLoad: function (options) {  
    let id = options.id; // 点击第二次分享的链接进入应该获取到id=2，但是怎么设置都是id=1  
    let source = options.source || 0;  
    console.log("onLoad.id:" + id);  
    console.log("onLoad.source:" + source);  
},  
onShareAppMessage: function (res) {  
    let that = this;  
    let source = that.$data.source;  
    if (source == 0) {  
        return {  
            title: '0元包邮，就差你啦!',  
            path: '/pages/marketing/help_free_shipping/index?source=1&id=1'  
        }  
    } else {  
        return {  
            title: '0元包邮，就差你啦!',  
            path: '/pages/marketing/help_free_shipping/index?source=1&id=2'  
        }  
    }  
}

更多关于uni-app微信分享onShareAppMessage方法return路径中设置的参数设置不成功的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

使用原生的微信小程序测试一下是否有同样问题？

更多关于uni-app微信分享onShareAppMessage方法return路径中设置的参数设置不成功的实战教程也可以访问 https://www.itying.com/category-93-b0.html


微信小程序会同步修复这个bug的吧 [握手]

回复 w***@126.com: 之前的回复错了（当成另外一个问题了）。已修改回复。

这不是uni-app的bug，而是微信小程序的页面缓存机制导致的。

问题分析：

  1. 微信小程序在页面跳转时会优先使用缓存中的页面实例
  2. 当分享链接指向同一个页面路径时，即使参数不同，小程序可能不会创建新的页面实例，而是复用已存在的实例
  3. 这种情况下，onLoad方法不会重新执行，导致无法获取到新的参数

解决方案：

方案一：使用onShow替代onLoad

onShow: function() {
    const currentPages = getCurrentPages();
    const currentPage = currentPages[currentPages.length - 1];
    const options = currentPage.options;
    let id = options.id;
    let source = options.source || 0;
    console.log("onShow.id:" + id);
    console.log("onShow.source:" + source);
}

方案二：监听页面参数变化

data() {
    return {
        currentId: '',
        currentSource: 0
    }
},
onLoad: function(options) {
    this.updateParams(options);
},
onShow: function() {
    const currentPages = getCurrentPages();
    const currentPage = currentPages[currentPages.length - 1];
    this.updateParams(currentPage.options);
},
updateParams(options) {
    if (options.id !== this.currentId || options.source !== this.currentSource) {
        this.currentId = options.id;
        this.currentSource = options.source || 0;
        console.log("currentId:" + this.currentId);
        console.log("currentSource:" + this.currentSource);
        // 执行相关业务逻辑
    }
}

方案三：强制页面重新加载 在分享路径中添加时间戳或随机数：

onShareAppMessage: function(res) {
    let that = this;
    let source = that.$data.source;
    const timestamp = new Date().getTime();
    
    if (source == 0) {
        return {
            title: '0元包邮，就差你啦!',
            path: `/pages/marketing/help_free_shipping/index?source=1&id=1&t=${timestamp}`
        }
    } else {
        return {
            title: '0元包邮，就差你啦!',
            path: `/pages/marketing/help_free_shipping/index?source=1&id=2&t=${timestamp}`
        }
    }
}
回到顶部