ionic4 路由跳转刷新实战
发布日期:2021-05-15 03:10:54 浏览次数:20 分类:精选文章

本文共 712 字,大约阅读时间需要 2 分钟。

flushing 刷新有时候会无效,具体问题如下:

  • 间歇性失效:跳转刷新偶尔不起作用,即使赋值清空也不渲染,需强制刷新。
  • 苹果手机无法跳转:售前页面无法正常跳转,导致交易未完成。
  • 无法取消订单:订单状态异常,取消功能失效。
  • 初始解决方案:

    this.nav.navigateRoot(['/tabs/order']); // 跳转至订单页面
    location.reload(); // 强制刷新

    问题:跳转后返回按钮消失,订单取消失效。

    第二种方法:

    this.router.navigateByUrl('tabs/order'); // 路由跳转
    location.reload(); // 强制刷新

    问题:初始跳转失败,订单状态异常。

    第三种方法:

    location.replace('#/tabs/order'); // 替换路由后刷新
    location.reload(); // 强制刷新

    成功解决后,页面刷新后功能正常,订单状态正确。

    小结:三种路由跳转刷新方式均采用强制刷新,效果如下:

  • this.nav.navigateRoot + 刷新:
    • 初始跳转后返回按钮消失,订单取消失败。
  • this.router.navigateByUrl + 刷新:
    • 跳转初始失败,订单状态异常。
  • location.replace + 刷新:
    • 成功解决问题,页面刷新后功能正常。
  • 补充建议:可以采用以下优化思路:

    • 传入跳转值:通过数据传递,让目标页面根据传入值决定是否刷新。
    • 页面自行刷新:在页面加载时自行刷新一次,并通过缓存判断是否聚焦,避免频繁刷新。

    通过以上方法,可以有效解决路由跳转刷新问题,提升用户体验,并确保数据准确性。

    上一篇:SQL Server2008 安装报错Restart computer failed的解决办法
    下一篇:【Vue】小例子入门以及生命周期探讨

    发表评论

    最新留言

    关注你微信了!
    [***.104.42.241]2025年04月09日 11时37分28秒