美文网首页
uni-app 小程序返回上一页并刷新数据的方法

uni-app 小程序返回上一页并刷新数据的方法

作者: 景彧 | 来源:发表于2022-03-19 21:09 被阅读0次
    一.需求:

    A页面--push到-->B页面,在B页面完成相关操作后pop返回上一页面A,根据B页面的操作结果控制返回A页面后是否刷新

    二.代码
    1. A 页面
    <script>
    export default {
        data() {
            return {
                refreshIfNeeded: false
            };
        },
        onShow() {
            var pages = getCurrentPages(); // 获取当前页面栈
            var currentPage = pages[pages.length - 1]; // 当前页面
            if (currentPage.data.refreshIfNeeded) {
                currentPage.data.refreshIfNeeded = false;
                this.refreshMethod(); // 当前页面 method中的方法,用来刷新当前页面
            }
        },
        onLoad(option) {
    
        },
        methods: {
            refreshMethod() {
    
            }
        }
    };
    </script>
    
    1. B 页面
    <script>
    export default {
        data() {
            return {
    
            };
        },
        onLoad(option) {
    
        },
        methods: {
          updateMethod() {
                update(data)
                            .then(res => {
                                console.log('修改信息 POST Success----');
                                uni.showToast({
                                    title: '保存成功',
                                    icon: 'success'
                                });
                                setTimeout(() => {
                                    // 返回上一页并刷新数据方法
                                    let pages = getCurrentPages(); // 当前页面
                                    let beforePage = pages[pages.length - 2]; // 上一页
                                    beforePage.data.refreshIfNeeded = true;
                                    // 返回上一页 delta返回的页面数 如果delta大于现有页面数,则返回首页
                                    uni.navigateBack({ delta: 1 }); 
                                }, 1000);
                            })
                            .catch(err => {
                                console.log('修改信息 POST Fail----');
                                console.log(err);
                                uni.showToast({
                                    title: '保存失败',
                                    icon: 'error'
                                });
                            });
            }
        }
    };
    </script>
    

    相关文章

      网友评论

          本文标题:uni-app 小程序返回上一页并刷新数据的方法

          本文链接:https://www.haomeiwen.com/subject/reendrtx.html