uniapp中刷新本页面的三种方法
方法一
利用路由,强制uniapp刷新当前页面
setTimeout(() => { this.$router.go(0) }, 500)
方法二
关闭当前页面,跳转到应用内的某给页面(如果想刷新当前页面也可以使用该方法):
uni.redirectTo({ url: '../details/details?gid=' + this.gid //写你的路径 });
还可用定时器来对该方法进行优化,使其稍微延缓动画
setTimeout( () => { uni.redirectTo({ url: '../details/details?gid=' + this.gid }); }, 500)
方法三
通过获取该页面实例执行其内部的生命周期方法来刷新页面
reload() { // 页面重载 const pages = getCurrentPages() // 声明一个pages使用getCurrentPages方法 const curPage = pages[pages.length - 1] // 声明一个当前页面 curPage.onLoad(curPage.options) // 传入参数 curPage.onShow() curPage.onReady() // 执行刷新 },
补充:uniapp如何根据路由手动onload刷新某一个页面
uniapp如何手动刷新要跳转到的页面?相信很多人百度查到的答案都是如下:
uni.switchTab({ url: '/pages/user/user', success(){ let page = getCurrentPages().pop(); //跳转页面成功之后 if (!page) return; page.onLoad(); //重新刷新页面 } });
但是在我做的项目中,会出现莫名的bug,pop出来的页面不是想要的,而且后面修改页面跳转的时候可能要修改代码,根据页面栈pop出来页面刷新很难定位刷新到我们想要的页面。那么有没有什么办法可以根据路由定位到我们要刷新的页面呢,根据官方api,我们可以获取已渲染加载的页面数组let pages = getCurrentPages()
,同时每一个页面都有page.route()
获取该页面的路由。所有我们只要遍历已渲染加载的pages,再比较pages里面的路由在调用相应页面的onload事件就好了,代码如下:
uni.switchTab({ url : '/pages/test/test', success() { let pages = getCurrentPages(); for(let i = 0; i < pages.length; i ++){ let tmppg = pages[i]; if(tmppg.route == "pages/test/test"){ tmppg.onLoad(); } // console.log('tmppg:' + tmppg) // console.log('tmppg.route:' + tmppg.route) } } })
总结
到此这篇关于uniapp中刷新本页面的三种方法的文章就介绍到这了,更多相关uniapp刷新本页面内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
JavaScript中变量声明有var和没var的区别示例介绍
在函数内部,有var和没var声明的变量是不一样的。有var声明的是局部变量,没var的,声明的全局变量,所以可以借此向外暴露接口东东2014-09-09Javascript 调用 ActionScript 的简单方法
在Flex中,ActionScript调用Javascript是比较简单的,说白了就是,在html里,怎么调用Javascript,在ActionScript就怎么调用就可以了。接下来通过本文给大家介绍js 调用 actionscript方法,感兴趣的朋友一起看看吧2016-09-09JS实现iframe编辑器光标位置插入内容的方法(兼容IE和Firefox)
这篇文章主要介绍了JS实现iframe编辑器光标位置插入内容的方法,可实现文本与图片的插入功能,并兼容IE和Firefox浏览器,需要的朋友可以参考下2016-06-06select、radio表单回显功能实现避免使用jquery载入赋值
select、radio表单回显避免使用jquery载入赋值,最好的做法是:在jsp页面进行逻辑判断,具体实现如下,感兴趣的朋友可以参考下哈,希望对大家有所帮助2013-06-06
最新评论