如图中所示,本来购物车是采用的后台数据库,get请求获取,但是客户要求改为缓存的形式保存购物车数据。在修改的过程中,如果是当购物车条目多于2条的时候,删除任意条目都是可以的。但是删除到剩余最后一条的时候,数据完全删完了。但是最后这一条,好像是界面BUG了,还是咋的,一直都没有清除,直到切换到其他界面重新进入购物车,触发onShow()里面的,重新getStorage()获取缓存数据,才OK,界面才清除完毕。有没有什么方法能够强制页面刷新解决掉这个BUG。图1是BUG效果,图2是相关代码(删除缓存数据,重新获取缓存数据) . 使用的是mpvue框架。1.0.13
这个onShow方法能够直接调用吗,但是页面报错,提示this.onShow() 方法未定义。要如何调用呢。
???方法未定义??你代码贴一下
提示: _this.onShow is not a function;
代码如下:
export default {
onShow() {
//this.openId = getStorageOpenid();
// 购物车的数据做缓存处理
this.getListData();
// this.setAddressDefault();
this.setBarTitle();
},
async delGoods(id, index) {
var _this = this;
console.log("id: "+id);
console.log("0 index: "+index);
wx.showModal({
title: "",
content: "是否要删除该商品",
success: function (res) {
if (res.confirm) {
_this.Listids.splice(index, 1);
var items= wx.getStorageSync("cartcookie");
console.log("1 删除之前: "+JSON.stringify(items));
items.splice(index, 1);
console.log("2 删除之后: "+JSON.stringify(items));
wx.setStorageSync("cartcookie",items);
//_this.getListData();//重新获取数据,刷新页面
_this.onShow();
} else if (res.cancel) {
//console.log("用户点击取消");
//滑动之前先初始化样式数据
_this.initTextStyle();
}
}
});
},
下面这个方法是
methods: { }
里面的方法。
去掉那个async 这个方法里面拿到的this,应该是vue page对象吧,onShow不是小程序的APP的方法吗?
var appInst = getApp();
appInst.onShow();
获取小程序对象之后,可以调用这个方法不报错,但是页面并没有像预期那样子更新。而且每次删除效果都失效了。
如果删除调用一次onshow呢???
这个onshow不能直接调用的吧,mpvue里面this代表的vue page对象,没有这个方法。不知道要怎么调取。
看了一下mpvue文档。。
现在调用 onShow()是OK了。但是还是有问题。Vue对象没有包含 onShow() 方法吧。 mpvue里面 两个生命周期,两个对象, 小程序APP对象会有onShow()方法, Vue对象有其他几个生命周期函数。比如mounted这种。