首页 > 其他分享 >vue3-使用百度地图遇到的坑-地图实例化

vue3-使用百度地图遇到的坑-地图实例化

时间:2023-02-10 10:33:24浏览次数:39  
标签:Map const 地图 实例 bmap vue3 data

1、创建地图实例

       原因:在使用vue3为了只定义一次地图实例,在所有方法中使用,直接使用如下定义方式:

 setup() {
    const data = reactive({
      bmap: null,})
    const initMap = () => {
      data.bmap = new BMapGL.Map("container"); // 创建Map实例
}}

  导致问题:地图上没有任何标注信息

 

  解决方式:

 setup() {
    const data = reactive({
      bmap: null,})

      const initMap = () => {
      map = new BMapGL.Map("container"); // 创建Map实例
      data.bmap = map;
      }
   }

最终效果:

 

标签:Map,const,地图,实例,bmap,vue3,data
From: https://www.cnblogs.com/xxdu/p/17108050.html

相关文章

  • vue3实现单页crud
    1.介绍主要实现单页curd,包含分页、新增、修改、删除、批量删除、条件搜索、表单校验。导入和导出暂未实现。、本文章只是学习过程。仅供参考。2.代码,按需复制修改即可......
  • 50.vue3.0解决vue项目中的“Invalid Host header”
    当在网页中输入地址后发现无法打开VUE项目地址:报错InvalidHostheader解决方法:在webpack5中disableHostCheck应该被遗弃了查看文档了解到需将disableHostCheck:true......
  • 开心档-Vue3 计算属性入门篇
    Vue3计算属性计算属性关键词:computed。计算属性在处理一些复杂逻辑时是很有用的。可以看下以下反转字符串的例子:实例1<divid="app">{{message.split('').reverse().......
  • 记录--Cesium+Vue实战教程——地图导航
    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助项目效果我们今天要实现的是一个路径规划的功能,有两个输入框。输入起点终点,然后查询,得到规划的路径,效果如......
  • Python装饰器实例讲解(二)
    Python装饰器实例讲解(二)Python装饰器实例讲解(一)你最好去看下第一篇,虽然也不是紧密的链接在一起参考B站码农高天的视频,大家喜欢看视频可以跳转忽略本文:https://www......
  • 网页抓取实例之wildberries电商平台数据抓取
     电商平台的数据抓取,一直是网页抓取公式的热门实战实例,之前我们通常是针对国内的电商平台进行数据抓取,昨天小编受到委托,针对一个俄罗斯电商平台wildberries做了数据抓取,......
  • vue2和vue3的区别有哪些?
    一、Vue3与Vue2区别详述1.生命周期对于生命周期来说,整体上变化不大,只是大部分生命周期钩子名称上+“on”,功能上是类似的。不过有一点需要注意,Vue3在组合式API(Com......
  • HTML 基础- 4个实例
    HTML标题HTML标题(Heading)是通过<h1>-<h6>标签来定义的。实例<h1>这是一个标题</h1><h2>这是一个标题</h2><h3>这是一个标题</h3>尝试一下»HTML段落HTM......
  • 地图用得好,数据更直观!bi软件都有哪些地图图表?
    地图图表的使用频率有多高?每次做分析报告十有八九都要用到它。但不同情况下所需的地图图表往往不同,这就要求bi数据可视化软件能够提供更加多多样化的地图图表。bi数据可视化......
  • 【视频】风险价值VaR原理与Python蒙特卡罗Monte Carlo模拟计算投资组合实例|附代码数
    原文链接:http://tecdat.cn/?p=22862 最近我们被客户要求撰写关于风险价值VaR的研究报告,包括一些图形和统计输出。风险价值(VaR)是一种统计数据,用于量化公司、投资组......