当前位置: 首页 > news >正文

页面需要重加载才能显示的问题修改

1.问题描述:跳转页面后,只有点击重新加载后才会显示内容

经过测试后:

/ 跳转详情 const goToDetail = (bookId) => { router.push({ path: '/classic-detail', query: { book_id: bookId } }) } 执行完以上代码后,页面从classicsView跳转到了ClassicDetail,但是ClassicDetail的onMounted函数中打印的qastore却仍然是上一个页面中的store内容

2.解决思路

可能原因:

  1. ​Store 状态未重置​
    Pinia store 默认是单例的,当从 classicsView 跳转到 ClassicDetail 时,store 仍保留之前的状态数据。此时立即打印会显示旧数据,直到新请求完成。

  2. ​异步时序问题​
    onMounted 中直接打印时,数据请求可能尚未完成,此时看到的是 store 的初始状态。

  3. ​路由参数处理不严谨​
    获取路由参数时可能出现类型错误,如 route.query.book_id 返回数组类型时未正确处理

最后修改措施:
由于两个store文件存在命名冲突(都使用了'classic'名称),导致加载store对象时无法分清到底加载哪一个,认为前一个和当前是相同的,因此没能成功加载新的qastore导致的问题,经修改,将ClassicDetail文件中的classic改为qaclass解决了问题

相关文章:

  • openstack热迁移、冷迁移、疏散
  • SQL注入原理及防护方案
  • 基于BenchmarkSQL的OceanBase数据库tpcc性能测试
  • Java异常处理全面指南:从基础到高级实践
  • [MCU]SRAM
  • 路由协议基础
  • 【JS-Leetcode】2621睡眠函数|2629复合函数|2665计数器||
  • 2025上海车展 | 移远通信重磅发布AR脚踢毫米波雷达,重新定义“无接触交互”尾门
  • C++之异常
  • (云计算HCIP)HCIP全笔记(九)本篇介绍操作系统基础,内容包含:操作系统组成、分类和定义,Linux的特性结构和Linux版本分类
  • 使用Three.js搭建自己的3Dweb模型(从0到1无废话版本)
  • 基于WebRTC技术,EasyRTC音视频实时通话助力全网会议的智能化转型
  • 虚函数表的设计和多态的实现
  • Vue3 Element Plus el-tabs数据刷新方法
  • 头歌实训之游标触发器
  • Android LiveData关键代码
  • 对鸿蒙 Next 系统“成熟论”的深度剖析-优雅草卓伊凡
  • 游戏哪些接口会暴露源IP?_深度解析服务器通信安全隐患
  • 关于 Web 服务器的五个案例
  • 迷你世界UGC3.0脚本Wiki组件说明
  • 买新房可申领学位,广州南沙出台购房入学政策
  • 政治局会议:优化存量商品房收购政策,持续巩固房地产市场稳定态势
  • 2025一季度,上海有两把刷子
  • 百位名人写“茶”字,莫言王蒙贾平凹都写了
  • 视频丨习近平同阿塞拜疆总统会谈:两国建立全面战略伙伴关系
  • 港澳航天员最早2026年飞天