# 问题背景 -- 分享的数据来源
当前在维护的小程序项目使用wepy开发;分享的数据都是通过接口请求后台的形式获得;然后存在了数据data的对象中;类似
```
定义分享数据
data = {
shareData: "", // 分享数据
}
获取分享数据
tip.getShareDataReci(res => {
that.shareData = res; // 赋值后台返回的分享数据
that.$apply();
}, curCode); // curCode当前商品的唯一code值
使用分享数据
onShareAppMessage(res) {
let that = this;
if (res.from === "button") {
// 来自页面内转发按钮
}
return {
title: that.shareData.title,
imageUrl: that.shareData.img,
path: that.shareData.path,
success: function(res) {
...
}
}
```
# 问题的发生
在大部分的电商网站都有类似的情况;在一个商品List中点击进入某一个商品详情A;然后在详情A的页面中又会有推荐的商品;这个时间点击进入商品详情B;点击分享(不区分右上角...分享和自己添加的分享按钮);分享的数据是自己存data里面的数据;也都是对的;关键的操作来了;这个时候返回商品A(不区分右滑返回和左上角返回键和物理返回键);点击分享;会发现分享的数据仍然是商品B的信息~
# 问题的解决
## 1. 出栈的解决方式
在商品详情A的推荐位置;点击的时候使用`redirect`出栈的方式去打开详情B;这个时候分享B是正确的;然后返回是不会到A的;因为被卸载了;直接从B回到了List;不会存在回到A之后分享数据不正确的问题~~
但是这样的解决方案带来的体验是不好的
## 2. 缓存读取的方式解决(目前在用的)
#### 2.1 存 -- 将code存缓存
第一步在商品List跳转到商品详情A的时候;在A的onluad周期中(返回不会触发该周期)进行存储`唯一code值`的动作
```
let reciCodeList = wepy.getStorageSync("reciCodeList"); // 定义获取的code集合
if (!reciCodeList.length) {
// 如果之前没有code则往新的数组中添加该code
wepy.setStorageSync("reciCodeList", [].concat(options.dishCode));
} else {
// 如果之前有code(可能在详情A的推荐位置又进入了详情B;类推)
// 会进行一个去重的动作;防止出现两个一样的
let i = utils.inArray(options.dishCode, reciCodeList);
if (i >= 0) {
shareData.splice(i, 1);
}
// 将可能进行去重处理过的数据存缓存
wepy.setStorageSync("reciCodeList",reciCodeList.concat(options.dishCode));
}
```
#### 2.2 改 -- 修改code集合
第二步在商品详情A的onUnload周期中(页面返回动作会触发该生命周期;页面出栈也会触发到)进行修改`reciCodeList`动作;**此动作是为了能在返回之后拿到正确的code值**
```
onUnload() {
// 先获取存储的code集合
let reciCodeList = wepy.getStorageSync("reciCodeList");
// 删除数组的最后一项(为了能在返回之后的页面拿最后一项即为当前正确项)
/* 我是一个栗子
在经过onluad以后会得到
在A的时候;存下了A的唯一code值;为reciCodeList = ['A'];
在B的时候;累计存下了B的唯一code值;为reciCodeList = ['A','B'];
在C的时候;累计存下了B的唯一code值;为reciCodeList = ['A','B','C'];
...
当触发返回的时候;会触发onUnload函数;这个时候去删除最后一下;会得到
在C的时候;存储的reciCodeList = ['A','B','C'];
这个时候去返回;并且删除最后一项;得到了
reciCodeList = ['A','B']; 并且页面回到了B的页面
*/
reciCodeList.pop();
// 存储新的集合
wepy.setStorageSync("reciCodeList", reciCodeList);
}
```
#### 2.3 取 -- 取到正确的code
第三步在商品详情A的onShow周期中(每次页面被显示都会触发;返回也是被显示了)进行获取分享数据的动作
```
async onShow() {
let that = this;
// 先获取存储的code集合
let reciCodeList = wepy.getStorageSync("reciCodeList");
if (reciCodeList.length) {
// 如果存在code值;则拿最后一个code值为当前code值
let curCode = reciCodeList[reciCodeList.length - 1];
// 当前值去发送请求;获得正确的分享数据
tip.getShareDataReci(res => {
that.shareData = res;
that.$apply();
}, curCode);
}
}
```
## 问题的延伸
可能会出现类似的问题;例如当前详情的分享+收藏+不同用户展示不用信息(下有栗子);都存在返回后数据不正确的情况;也可以一并使用这个方案处理
```
// 我是不同用户展示不用信息的栗子
// 依然使用前文的 A B C (详情页都有登录的入口)
A页面是未登录状态;显示未登录状态该有的展示信息;不在A页面登录;点击推荐位置到B页面
B页面起初显示的也是未登录状态下的展示信息;这个时候在B页面进行了登录;回到A还是未登录的状态
这个时候只需要在A的onShow取一次缓存的用户信息即可
that.userInfo = wepy.getStorageSync("userInfo");
```
这个是目前微信存在的bug;可先通过方法规避开;等微信修复了以后就乐呵呵了~~~