微信小程序返回上一页刷新组件数据的示例代码

 更新时间:2024年03月11日 10:23:24   作者:迪卢克的现任  
这篇文章主要介绍了微信小程序返回上一页刷新组件数据的相关资料,本文通过实例代码给大家介绍的非常详细,需要的朋友参考下吧

微信小程序返回上一页刷新组件数据

在父页面的onShow和onHide里面添加一个标志

onShow() {
        this.setData({
          show:true
      })
    },
    onHide() {
      this.setData({
        show:false
    })
    },

 把这个值传给子组件

<importantList slot="importantConcern" flag="{{barSelect}}" flag2="{{show}}" />

 在子组件的properties方法里面进行判断当flag2为true的时候调用刷新函数刷新

 properties: {
    flag: {
      type: String,
      observer: function(news) {
       if(news==='importantConcern'){
         this.getnewTablist(this.data.code)
       }
      }
    },
    flag2: {
      type: String,
      observer: function(news) {
       if(news==='true'&&news==='importantConcern'){
         this.getnewTablist(this.data.code)
       }
      }
    },
  },

补充:

微信小程序返回上一级页面并自动刷新数据

前言

界面由A到B,在由B返回A,触发刷新动作

一、获取小程序栈

界面A代码

 shuaxin(){
   //此处可进行接口请求从而实现更新数据的效果
   console.log("刷新本页面数据啦")
 },

界面B代码

// 返回触发事件上
// Taro代码为例
goBack(){
    let pages = Taro.getCurrentPages();   //获取小程序页面栈
    let beforePage = pages[pages.length -2];  //获取上个页面的实例对象
    beforePage.shuaxin();   //触发上个页面自定义的shuaxin方法
    wx.navigateBack({         //返回上一页  
      delta:1
    })
},

二、生命周期触发

代码如下(示例):

componentDidShow (){}

在小程序环境中对应页面的 onShow。

页面显示/切入前台时触发。

总结

Taro React生命周期函数

到此这篇关于微信小程序返回上一页刷新组件数据的文章就介绍到这了,更多相关微信小程序返回上一页刷新组件数据内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 小程序数据缓存机制应用实现

    小程序数据缓存机制应用实现

    这篇文章主要介绍了小程序数据缓存机制应用实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-05-05
  • javascript实现的字符串转换成数组操作示例

    javascript实现的字符串转换成数组操作示例

    这篇文章主要介绍了javascript实现的字符串转换成数组操作,涉及javascript字符串与数组相互转换、以及数组反转相关操作技巧,需要的朋友可以参考下
    2019-06-06
  • javascript实现yield的方法

    javascript实现yield的方法

    这篇文章介绍了javascript实现yield的方法,有需要的朋友可以参考一下
    2013-11-11
  • js数组去重的5种算法实现

    js数组去重的5种算法实现

    这篇文章主要介绍了js数组去重的5种算法实现,详细解释了实现思路,以及每个算法的优缺点,感兴趣的小伙伴们可以参考一下
    2015-11-11
  • 保证JavaScript和Asp、Php等后端程序间传值编码统一

    保证JavaScript和Asp、Php等后端程序间传值编码统一

    在WEB开发过程中,前后端要求数据编码一致的处理是经常会碰到的!
    2009-04-04
  • JavaScript数组reduce常见实例方法

    JavaScript数组reduce常见实例方法

    reduce方法在数组的每个元素上执行用户提供的回调函数,即"reducer",它传入对前一个元素进行计算的返回值,结果是单个值,它是在数组的所有元素上运行reducer的结果,下面这篇文章主要给大家介绍了关于JavaScript数组reduce常见实例方法的相关资料,需要的朋友可以参考下
    2022-05-05
  • 微信小程序模拟cookie的实现

    微信小程序模拟cookie的实现

    本篇文章主要介绍了微信小程序模拟 cookie的实现,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-06-06
  • JavaScript中防抖和节流的区别及适用场景

    JavaScript中防抖和节流的区别及适用场景

    这篇文章主要介绍了JavaScript中防抖和节流的区别及适用场景,文章通过围绕主题的相关资料展开详细的内容介绍,具有一定的参考价值,需要的小伙伴可以参考一下
    2022-05-05
  • javascript禁止超链接跳转的方法

    javascript禁止超链接跳转的方法

    这篇文章主要介绍了javascript禁止超链接跳转的方法,结合实例分析了JavaScript事件机制与鼠标事件的响应操作技巧,需要的朋友可以参考下
    2016-02-02
  • 微信小程序使用wx.navigateTo路由跳转层级限制问题小结

    微信小程序使用wx.navigateTo路由跳转层级限制问题小结

    在微信小程序开发中,wx.navigateTo和wx.redirectTo是两种页面跳转方式,wx.navigateTo允许跳转到新页面并保留当前页面,适合需要返回的场景,但受页面栈10层限制,wx.redirectTo则关闭当前页面后跳转,本文介绍微信小程序使用wx.navigateTo路由跳转层级限制问题
    2024-10-10

最新评论