利用onPageShow实现返回刷新的操作

​ 之前提到过aboutToAppear和onPageShow的区别以及基础的概念，今天我们来聊一下这两个在实际项目中的应用。如果你写过小程序的话，可以将aboutToAppear类别成onLoad，onPageShow类别为onShow，他们的逻辑是相同的。

可以试想一下这样的应用场景：

这是一个论坛的贴子列表页面，右下角有一个“新增贴子”的按钮，点击以后进入新增贴子的页面，然后当用户输入了内容点击提交后，提示“新增成功”，并返回到列表页。那么这时候，列表页要做的就是刷新贴子列表，把刚才新发布的贴子显示出来。

或者

这是一个商品列表页，左边是商品分类，右边是对应的商品列表，然后在每个商品信息那里，都显示了有多少个被加入了购物车，点击商品进入了商品详情页，在详情页中，用户可以把商品加入购物车，当返回到列表页时，对应的商品信息中的购物车数量要进行改变。

当然，有很多种实现方法，例如说我认为比较合理的订阅消息提醒emitter（这个后面会提到）、跨组件的@Watch装饰器，或者更麻烦的LocalStorage等……

在平时写毕设项目的时候，我发现其实最简单的……还是用onPageShow，因为onPageShow的意思是：当这个页面显示以后执行什么代码。我们以刚刚场景中的第一种为例，假设贴子列表页为A，新增贴子的页面为B，从A跳转到B的时候，一般我们用的都是router.push进行跳转的，用通俗的讲法来说，就是A页面上，覆盖了B页面，所以你看到的是B页面，但是这个时候，A页面仍然是存在的，只不过因为被覆盖了所以看不到（现在官方主推navigation，就是因为有的开发者，不停的去覆盖，覆盖了一堆页面，然后底下被覆盖的又存在着，极度影响性能），然后从B页面返回的时候，就是把B页面从这一堆页面里拿走，这样A页面又被显示了，你就能看到A页面了。所以这个时候，A页面的onPageShow就会被触发了……

那么如果把从后端获取数据的接口代码写在onPageShow里的话，那么只要从第二个页面返回到列表页，都能够刷新数据。当然……这种写法也就是在毕设或者在不常显示的页面里可以用用，否则无论在跳转后的页面里是否进行了对应的操作（比如新增了贴子），都会去重新获取数据。

最后，为了贴子的完整性，我们再看一下官方对于生命周期的执行顺序图片：