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

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

1.业务场景

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

2.分析

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

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

3.代码示例

<template>
	...
</template>

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

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