uni app 微信小程序 点餐系统【再来一单】页面跳转

1 类似饿了么 点击【再来一单】的效果

2 点击再来一单的时候，获取该订单的订单id，跳转页面，通过订单id  获取订单中的商品id，查询商品id，商品必须是上架状态/库存不能为0等。

3 商品成功添加之后，再次点击【再来一单】，没有继续添加商品到购物车里，但是会跳转。

4 添加其他商品可以 添加到购物车里

--------------------------------------------------------------------------------------------------

 

遇到的问题：

点击【再来一单】跳转页面的时候，商品成功加入购物车。每次从其他页面进入购物车的时候，购物车累计添加同样的商品。

代码：

template中：
再来一单

methods中:
onceMore(orderId) {
	if(orderId != '') {
		uni.setStorageSync('orderId', orderId);
		uni.switchTab({
			// 再来一单
			url:"/pages/index/index"
		})
	}
}

/pages/index/index.vue：

script中：
onShow() {
    this.orderId = '';
    this.type = '';
    this.orderId = uni.getStorageSync('orderId');
    console.log("this.orderId="+this.orderId);
    if(this.orderId != '' && this.orderId != undefined && this.type != '' && this.type != undefined) {
        if(!this.cartFlag) {
        	this.getAddCartGoods(this.orderId, this.type);
        }
    }
},

 

分析：

① 认为是onShow问题。

于是将onShow和onLoad换了好多遍，于是有了以下理解。

-----onShow和onLoad的区别-----

onShow：每次切换页面再切换回来都会重新加载

onLoad：只加载一次页面，切换页面也不会加载

不是这个问题。

② 猜测了一下是不是缓存问题。

于是查了switchTab的传值setStorageSync和接收参数getStorageSync。

在uni-app官网中找到了相关介绍（https://uniapp.dcloud.io/api/storage/storage?id=setstoragesync）

 

 

 

setStorageSync是存放在本地缓存中的，getStorageSync是从本地缓存中取值。那么我页面切换的时候传值一直都是存在的，所以每次页面切换，再切换回加入购物车的页面时都会累计加商品到购物车里。哪怕没有点击再来一单也会累计。

恰巧在官网看到了removeStorage。

 

 

于是在index.vue中添加了代码：

script中：
onShow() {
    this.orderId = '';
    this.type = '';
    this.orderId = uni.getStorageSync('orderId');
    console.log("this.orderId="+this.orderId);
    // 清除缓存中的orderId，但是页面已经获取到orderId，直接用全局变量即可
    uni.removeStorage({
       key: 'orderId',
           success: function (res) {
           console.log('success');
       }
    });
    if(this.orderId != '' && this.orderId != undefined) {
        if(!this.cartFlag) {
        	this.getAddCartGoods(this.orderId);
        }
    }
},

 

这样就解决问题了。