类型
状态
日期
文章链接
概览
标签
分类
图标
密码
创建时间
Feb 10, 2023 06:19 PM
最近更新时间
Feb 10, 2023 06:54 PM
目前在公司目前开发的gis项目中大量页面需要用到3d地图，如果每个页面点开都初始化一遍地图实例，将会耗费大量的浏览器资源用在无意义的加载上，所以，迫切需要一个将地图组件能够单例化的方法。实现在任何地方使用地图组件，都只会直接使用加载好的，不需要重复加载。
想法一
此方法也是在多个类似项目中提出并完成实施的解决方案，通俗易懂的讲就是讲地图直接当成项目的背景使用。切换页面时，只切换加载组件即可。
此方法适合页面均为全地图且无其他背景的项目。
缺点：
- 切换路由得去判断当前需要显示的组件，较为麻烦。
- 对于只显示半个地图或者部分地图的页面无法适应。
想法二
借鉴类中的单例模式，将地图组件设计成单例，只在第一次加载时才会render。其他地方只需要引用即可。
很不幸，尝试了很久，才疏学浅，没有办法在现有的vue3暴露出的方法实现这样的操作。以后再试，要是能实施了，再回来补全。
想法三（目前方案）
也是在做想法二的尝试时想到的，可以利用Vue的
<teleport> 来实现哪里需要放哪里。而我们可以把地图组件放在App中加载，这样，只需要一次加载，即可在任何地方使用。话不多说，下面上代码。首先，需要定义一个状态管理器，来设置和监听地图需要放置的地方
定义一个我们需要的地图容器，用来做中间组件插入地图使用
在App中使用地图组件，并将其放置到对应位置
最后在组件中使用地图
- 作者:Jenson
- 链接:https://blog.jsmiao.com/article/7478dcab-0a49-4db2-a7f3-e2cabe9ea09e
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。
