window.location.href()/replace()/reload() -- 页面跳转+替换+刷新

这篇具有很好参考价值的文章主要介绍了window.location.href()/replace()/reload() -- 页面跳转+替换+刷新。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

1. window.location.href = 'url' ;  改变地址进行跳转

2. window.location.replace('url') ;  将地址替换成新的url, 该方法通过制定的url替换,当前缓存在历史里(客户端)的项目,因此当使用了replace方法之后,你不能通过 前进 和 后退 , 来访问已经被替换的url, 这个特点对一些过渡页面非常有用!

例: 

        点击登录按钮,会触发跳转的方法,这里就会进入缓存的业务页面的url地址

// 登录页 ==> 触发登录方法

if (!Utils.launchRedirect.existLaunchPageByUrlPath()){
	uni.redirectTo({
			url: Config.indexRoute
		})
	}
	else{
		Utils.launchRedirect.redirectlaunchPage()
	}
// launchRedirect.js


//重定向页面
function redirectlaunchPage() {
	if (existLaunchPageByUrlPath()){
		// window.location.replace ==> 将目前浏览器的地址替换掉 uni.getStorageSync('launchPage') ==> 获取存储中对应的key
		// 使用 window.location.replace 方法之后,不能前进、后退来访问已被替换的url
		window.location.replace(uni.getStorageSync('launchPage'))
		// 从本地缓存中同步移除指定 key
		uni.removeStorageSync("launchPage")
	}
}

//通过是否缓存相应的入口业务页面
function existLaunchPageByUrlPath() {
	try {
	    const value = uni.getStorageSync('launchPage');
	    if (value && value!="") {
	        return true
	    }
		return false
	} catch (e) {
	    return false
	}
}

3. window.location.reload() ;  强制刷新页面文章来源地址https://www.toymoban.com/news/detail-503618.html

到了这里,关于window.location.href()/replace()/reload() -- 页面跳转+替换+刷新的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 小程序跳转tabbar,tabbar页面不刷新

    文章地址:12.小程序 之切换到tabBar页面不刷新问题_360问答 解决办法备份: wx.switchTab:跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 wx.reLaunch:关闭所有页面,打开到应用内的某个页面。 wx.reLaunch是可以跳转到tabBar页面的。它和wx.switchTab的区别就是:前者可以触发onLoad事

    2024年02月04日
    浏览(42)
  • VUE路由跳转并刷新页面(框架层实现)

    前言         网上找了很多办法,都需要开发者在页面内单独实现,或者是刷新整个浏览器,感觉并不是特别舒服。因此,我考虑可以在框架层去实现路由跳转刷新。         思路如下:                 1、重定向至临时界面(用户无感知)                 2、打开临时

    2024年02月11日
    浏览(58)
  • vue跳转页面后返回不刷新且记录历史滚动条停留位置 (实现了根据不同页面来设置是否刷新记录的功能)

            1.在路由(router/index.js)中,对不刷新的页面设置:         2.在app.vue中设置: 这时返回就不会触发created和mounted         1.在data中定义         2.挂载: 以上就实现了返回页面后滚动条记忆的功能啦! 如果想实现分情况决定是否记忆滚动条以及刷新组件数据

    2024年02月08日
    浏览(49)
  • vue通过router地址传参跳转同一路由页面,页面不刷新的解决办法

    vue、 vue-router@4 记录一下最近遇到的vue路由页面间的跳转的问题,其中就涉及到了不同路由的跳转(/a/b1 = /a/b2)、相同路由不同参数间的跳转(/a/b?c=1 = /a/b?c=2)、相同页面锚点跳转(/a/b#id1 =/a/b#id2) 原因:渲染的是同一组件 解决:可以在不刷新的页面通过监听route,重新加载

    2024年02月04日
    浏览(61)
  • 关于vue路由跳转后的页面不会刷新的解决办法

    做uni项目的时候遇到的情况:1,父组件页面刷新了之后 需要触底加载的子组件能触底加载,否则不能加载。2,子组件不能触底加载,只需要刷新之后就能触底加载。以上的刷新不包括下拉刷新。3. 可能因为包了一层tab页导致跳转进页面没有请求数据的问题。 我的解决办法是

    2024年02月11日
    浏览(63)
  • vue3在运行时路由可以正常跳转,但是页面空白,刷新页面恢复正常[已解决]

    vue3在运行时路由可以正常跳转,但是页面空白,刷新页面恢复正常,在网上寻找很久说是keepAlive的原因,后来看了看我的代码~ 原来的代码: 改后的代码: 由此可见,根元素一定要由一个div去包裹住! template必须有且只能有一个div 在这样才会正常显示~ 原理: 这里我们要先

    2023年04月27日
    浏览(59)
  • 解决vue3项目跳转同一页面数据不刷新的问题

            原因:router-view使用了keep-alive组件,会被缓存,而vue-router的切换不用于传统的页面切换。是路由之间的切换,组件之间的切换,引用相同组件的时候,会被直接调用缓存里面的而不会调用created(),onMoun ted()函数。         如图所示:要实现的功能是点击每一个

    2024年02月11日
    浏览(37)
  • Vue 解决route-link路由跳转时页面不刷新问题

    1.分析 在使用route-link跳转路由时,每次跳转,页面都不会刷新。是因为路由跳转并非页面刷新,而我们获取数据的方法都是写在created钩子函数中,所以,created并不会每次都执行,从而导致页面数据没有刷新。 2.解决方法 在router-view标签中加入:key=\\\"$route.fullPath\\\"即可

    2024年02月11日
    浏览(38)
  • vue-element-admin vue设置动态路由 刷新页面后出现跳转404页面Bug 解决方法

    做项目时遇到的这个bug,因为除了跳404之外也没太大影响,之前就一直放着没管,现在项目基本功能实现了,转头处理了一下,现在在这里记录一下解决方法 这个bug的具体情况是:设置了动态路由之后,不同的用户登录之后显示了不同的侧边栏,在侧边栏点击菜单,渲染对应

    2024年04月28日
    浏览(60)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包