背景

我们在微信小程序开发过程中，经常会遇到点进去详情页，然后更新详情后，返回到上一页（比如列表页），之后需要更新列表页的数据这种场景需求，那我们需要怎么做才能更好的去实现呢？

常见解决方法

onShow生命周期直接调接口刷新数据

很多刚接触小程序开发的小伙伴，可能第一个想到的是在onShow生命周期中，调用接口，更新列表数据。首先，我们需要了解onShow和onLoad的区别。

onLoad()和onShow()生命周期

• onLoad()：在页面加载的时候触发，只会调用一次，在onLoad()函数中，可以通过option获取当前页面路径中的参数
• onShow()：在页面显示时调用，也就是切换页面的时候，或者切入前台时触发，可以多次触发

由于我们是当详情有更新时，返回到列表页中，就必须去刷新数据，结合以上对两个生命周期的描述，很明显，我们是需要使用onShow()生命周期的，但是它是每次都会去触发，而我们的需求是只有数据更新才需要去调用接口刷新数据，因此，我们需要有一个变量needRefresh来告诉我们何时去刷新。

data () {
    return {
        needRefresh: false // 是否刷新页面
    };
}

当我们在详情页中，保存更新成功后，我们需要改变上一页的needRefresh的值为true，返回到列表页中之后，在onShow()函数中，进行needRefresh的判断，当为true时，调用接口，刷新数据，便可实现我们的需求。

在详情页中修改needRefresh的值

let pages = getCurrentPages(); // 当前页面栈
let prePage = pages[pages.length - 2]; // 上一个页面

prePage.$vm.needRefresh = true; // 更新上一页data中needRefresh的值为true

列表页中判断needRefresh的值

在onShow()生命周期中，判断needRefresh的值为true时，调查询接口刷新页面数据，并将needRefresh改为false，以便后续判断是否需要刷新数据。

onShow () {
    if (this.needRefresh) {
        this.getData(1); // 从第一页重新获取数据
        this.needRefresh = false;
    }
},

结语

我们背景中的需求便可通过以上方法实现，小伙伴们有其他的或者更好的解决方案也欢迎在评论区分享哦~