【天天新要闻】实现小程序onShow第一次页面加载不执行

2022-12-28 06:06:27 来源：博客园

(资料图)

实现小程序onShow第一次页面加载不执行

1.业务场景

在做小程序实际的业务中，是否有过在当前列表页点击某个入口，跳转到修改页面，在跳回当前页面并重新刷新数据的需求？

2.分析

上面的业务，我们可以借助onshow函数来进行执行，onShow点击链接查看，每次页面展示时执行该方法。如果你直接在该函数内包裹重新请求的代码块时，你肯定会遇到第一次请求该页面时，请求数据的代码被执行了两次。

这时，我们可以在onshow函数中做一个判断，添加一个标识isFirst来控制判断，当然初始置isFirst=true，证明是第一次执行。那么在第一次执行时，我们使用if代码块包裹请求数据的代码块,并判断不让onShow函数里面的代码执行，同时我们可以在第一次加载页面时必须调用的方法里，将isFirst的状态值进行修改。这样但你从入口到其他页面后再返回当前页面时，功能仍然可以满足，而且第一次加载该页面时，onShow里的方法不会执行。

3.代码示例

<script>const vue = new Vue({        data(){            return{                ...                isFirst:true,                ...            }        },        onLoad(){        querList();                },        onShow(){            if(!isFirst){             querList();               }        },        methods:{            //获取数据的函数            querList(){                this.isFirst = false;                ...            }        }    })</script>

好的，以上就是我这次分享给大家的内容，若大家有更好的方法，请在评论区留言哦！:happy:

关键词：进行修改仍然可以