Skip to content

GitLab

  • Projects
  • Groups
  • Snippets
  • Help
    • Loading...
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in / Register
T treasure
  • Project overview
    • Project overview
    • Details
    • Activity
    • Releases
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 14
    • Issues 14
    • List
    • Boards
    • Labels
    • Service Desk
    • Milestones
  • Merge requests 0
    • Merge requests 0
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
  • Operations
    • Operations
    • Incidents
    • Environments
  • Packages & Registries
    • Packages & Registries
    • Container Registry
  • Analytics
    • Analytics
    • CI/CD
    • Repository
    • Value Stream
  • Wiki
    • Wiki
  • External wiki
    • External wiki
  • Snippets
    • Snippets
  • Members
    • Members
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • FE
  • treasure
  • Issues
  • #194

Closed
Open
Created Oct 10, 2023 by a7@a7

移动端H5页面高德地图使用react-activation的KeepAlive缓存之后路由回来导致地图消失白屏

问题:移动端H5页面在某个初始页面使用高德地图并且对该页面做KeepAlive缓存,跳转至后续页面,当后续页面也存在地图的时候,回到缓存页面导致原本初始地图页面白屏。

现象: image 原始: image 缓存路由回退初始页面白屏现象: image 可以发现canvas的宽高被重置了。。

原因:canvas绘制后续组件的内容之后,点击某个按钮改变canvas高度,引起画布重绘,导致之前的高德地图的画布内容会丢失。

解决方式: 在组件激活的时候重新resize地图实例 useActivate(() => { mapIns && mapIns.resize(); }); image

Edited Oct 10, 2023 by a7
Assignee
Assign to
None
Milestone
None
Assign milestone
Time tracking