报错如下,可能是因为目标div还没生成

elementUi文档说明

在dom生成后再调用,正常

    buildMap(){
let map = new BMap.Map("allmap");
map.enableScrollWheelZoom(); //启用滚轮放大缩小,默认禁用
map.enableContinuousZoom(); //启用地图惯性拖拽,默认禁用 let myGeo = new BMap.Geocoder();
myGeo.getPoint(this.address, function(point){
if (point) {
map.centerAndZoom(point, );
let marker = new BMap.Marker(point)
map.addOverlay(marker);
marker.setAnimation(BMAP_ANIMATION_BOUNCE);
}else{
alert("您选择地址没有解析到结果!");
}
}, "广东省");
}
    <!--百度地图定位-->
<el-dialog title="百度地图定位" :visible.sync="showMap" @opened="buildMap">
<div id="allmap" :style="'height: '+window.screen.height*0.5+'px'"></div>
</el-dialog>

效果

vue使用百度地图

直接在index引入即可,不要用什么百度地图vue版,不好用,缺功能

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=密钥"></script><!--百度地图-->

参考

vue里面使用百度地图api 报错 Cannot read property 'gc' of undefined

百度地图api

elementUi模态框使用baiduMap错误记录的更多相关文章

  1. elementui 模态框 拖动

    第一步引入import elDragDialog from "@/directive/el-dragDialog";第二步 在export default中声明directives ...

  2. Ionic3错误记录:navigation stack needs at least one root page

    BUG场景:在 ActionSheetController 使用modalCtrl.create 创建模态框时报如下错误 原代码片段 解决方式: 重新设置root page

  3. element-ui公用模态框自定义样式与scoped样式生效问题解决方案

    //先插如效果图 里面内容均为传进来的.包括取消与确定按钮,因为每个页面的绑定事件不一样. //下面这个图片为初始样式 //拖动模态框指令需要插件.详情看我下一篇,以下是地址 https://www. ...

  4. 使用Bootstrap模态框实现增删改查功能

    模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动.子窗体可提供信息.交互等. 本文实现的是使用模态框实现简单的增删改查的功能. ...

  5. 使用ajax请求,模态框调用并更改密码

    前端页面 <a href="javascript:void(0);" onclick="changPassword()"> <i class= ...

  6. BootStrap——模态框

    模态框(Modal)是BootStrap中很棒的一个插件.可以去BootStrap菜鸟驿站里面看看. 模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开 ...

  7. 用jQuery写了一个模态框插件

    用jQuery写了一个模态框插件 大家觉得下面的框框好看么, 水印可以去掉(这个任务交给你们了(- o -)~zZ); "info"框 $("div").con ...

  8. Bootstrap 模态框

    Bootstrap 模态框(也可以说的弹出层) 最近在尝试使用bootstrap的模态框 使用模态框主要要引入一下几个js和css: bootstrap.css jquery.1.9.1.js(这个可 ...

  9. Bootstrap 模态框(也可以说的弹出层)

    最近在尝试使用bootstrap的模态框 使用模态框主要要引入一下几个js和css: bootstrap.css jquery.1.9.1.js(这个可以灵活选择) bootstrap.js html ...

随机推荐

  1. 【cf849ABC】

    849A - Odds and Ends 问能否将序列划分为奇数个长度奇数的奇数开头奇数结尾的子区间. 一开始想dp..不过没必要. const int N=201000; int n,a[N]; i ...

  2. RequestContextHolder 很方便的获取 request

    在 Spring boot web 中我们可以通过 RequestContextHolder 很方便的获取 request. ServletRequestAttributes requestAttri ...

  3. NOIP2013花匠(波动序列)

    波动序列的定义不用多说,下面给出波动序列的求法. #include<iostream> #include<cstdio> #define N 100002 using name ...

  4. hdu 2328 Corporate Identity(kmp)

    Problem Description Beside other services, ACM helps companies to clearly state their “corporate ide ...

  5. D: Starry的神奇魔法(矩阵快速幂)

    题目链接:https://oj.ismdeep.com/contest/Problem?id=1284&pid=3 D: Starry的神奇魔法 Time Limit: 1 s      Me ...

  6. 1062.Talent and Virtue

    About 900 years ago, a Chinese philosopher Sima Guang wrote a history book in which he talked about ...

  7. django(八)之数据库表的一对多,多对多表-增删改查

    单表操作 表记录的添加 方式一: Book() b=Book(name="python基础",price=99,author="yuan",pub_date=& ...

  8. linux 日常中会用到的命令(持续更新)

    1. grep 比如,我要查看www目录下所有包含   “聊天室”  的文件 grep -rn "聊天室" * 比如我要把  www  目录下所有文件中的    聊天室   替换为 ...

  9. JS验证身份证

    话不多说,直接看代码 JS部分 /** * 身份证15位编码规则:dddddd yymmdd xx p * dddddd:地区码 * yymmdd: 出生年月日 * xx: 顺序类编码,无法确定 * ...

  10. bzoj 2002: [Hnoi2010]Bounce 弹飞绵羊(分块算法)

    传送门 题意: 中文题意,不再赘述. 题解: 下午在补分块算法的相关知识,看到某大神博客推荐的这道题目,就试着做了做: TLE了一下午可还行: 我的思路: 将这 n 个点分成 sqrt(n) 块: i ...