Error in mounted hook: "TypeError: AMap.MouseTool is not a constructor"

最新推荐文章于 2025-06-09 16:27:08 发布
最新推荐文章于 2025-06-09 16:27:08 发布
阅读量6.7k 收藏
点赞数 2
CC 4.0 BY-SA版权
分类专栏： Web前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_35366269/article/details/102590135
本文介绍了在Vue项目中遇到'TypeError: AMap.MouseTool is not a constructor'错误的解决方法。问题出在引入高德地图JS文件时未加载MouseTool插件。解决方式是在高德地图的JS文件路径后添加&plugin=AMap.MouseTool，确保插件正确加载。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

错误提示：

 

解决办法：

       如果是直接引入的高德地图js文件，那么只需在路径后面添加 &plugin=AMap.MouseTool 即可，全部路径如下：

<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=你申请的KEY=AMap.MouseTool"></script>

 

      效果图：

高德地图使用插件报错AMap.Xxx is not constructor
qq_43447509的博客
03-23 1万+
报错的原因是在代码中使用了地图插件例如ToolBar、OverView、Scale，但是并没有加载插件 解决方案 同步加载插件：在引入地图的script标签进行如下拼接，多个插件用逗号分隔 <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=您申请的key值&plugin=AMap.ToolBar,AMap.Driving"></script> 异步加载插件：通
2022年最新前端面试题（大前端时代来临卷起来吧小伙子们..持续维护走到哪记到哪）
m0_55613022的博客
02-24 3516
HTML和Css部分 1、对BFC规范（块级格式化上下文）的理解 BFC 块级格式化上下文 一块独立的区域，有自己的规则，bfc中的元素与外界的元素互不影响 BFC是一块用来独立的布局环境，保护其中内部元素不受外部影响，也不影响外部。 怎么触发BFC 1. float的值left或right 2. overflow的值不为visible（默认） 3. display的值为inline-block、table-cell、table-caption 4. position的值为absolute（绝对定位）或f
vue中高德api报错 Error in mounted hook: “TypeError: AMap.MouseTool is not a constructor“
BiangBaing的博客
08-17 2251
这样使用起来是没任何问题的，都可以正常使用，但是打包后的环境再测试，就会出现。index.html页面引入的时候key后面跟上。index.html页面中引入高德api。直接在声明这里进行了初始化。
vue使用高德地图 -- AMap.Autocomplete is not a constructor报错问题
gongyanzi的博客
06-09 145
把 AMap.Autocomplete换成这个AMap.AutoComplete。
❤后端环境搭建---基于SpringBoot+MySQL+Vue+ElementUI+Mybatis+Redis前后端分离管理系统搭建MySQL（ windows ）
林太白
03-22 3959
❤后端环境搭建---基于SpringBoot+MySQL+Vue+ElementUI+Mybatis+Redis前后端分离管理系统搭建MySQL（ windows ）
vue-amap 初始化报错 AMap.PolyEditor is not a constructor 和 a[d].split is not a function
lyn1772671980的博客
03-29 3970
main.js中 import VueAMap from 'vue-amap' Vue.use(VueAMap) VueAMap.initAMapApiLoader({ key: '6cf4109dca43906adfe00d4bbb6d93b5', // 康药麦麦高德key plugin: [ 'AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Scale', 'AMap.OverView', 'AMap.Too
vue使用高德地图报错：AMap.DistrictSearch is not a constructor问题解决
热门推荐
夏夏
08-06 1万+
这个问题说的 是没有初始化，解决如下： 参考：https://blog.csdn.net/shidaping/article/details/78537730
mounted hook: "TypeError: AMap.GeoJSON is not a constructor"
最新发布
06-14
</think>### 解决 Vue mounted hook 中 "AMap.GeoJSON is not a constructor" 的 TypeError 问题 此错误通常发生在高德地图插件未正确加载时。以下是完整的解决方案： #### 解决方案步骤 1. **添加 GeoJSON 插件...
腾讯地图var search = new TMap.service.Search({pageSize: 10})出现 Error in mounted hook: "TypeError: TMap.service is not a constructor"错误怎么解决
02-07
<script src="https://map.qq.com/api/js?v=2.exp"></script> ``` 然后，在使用 TMap.service.Search 之前，您需要等待地图初始化完成。您可以使用 TMap.init() 方法来初始化地图，并在地图初始化完成之后再使用 ...
手把手带你撸一遍vue-loader源码
vv_bug
07-31 3364
前言 前面写过两篇webpack实战的文章： webpack实战之（手把手教你从0开始搭建一个vue项目） 手把手教你从0开始搭建一个vue项目（完结） 强烈建议小伙伴们去看一下前面几个章节的内容， 这一节我们研究一下vue-loader。 介绍 Vue Loader 是什么？ Vue Loader 是一个 webpack 的 loader，它允许你以一种名为单文件组件 (SFCs)的格式撰写 Vue 组件： <template> <div class="example">
解决AMap.PolyEditor is not a constructor报错
weixin_38824257的博客
05-09 1万+
最近在使用项目中VueAMap组件时，虽然在main.js下已经引入了AMap.PolyEditor插件，但是使用时依然报错。 解决方法： 在项目index.html中，使用script标签将AMap.PolyEditor插件引入。 <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.6&key=你的key&plugin=AMap.PolyEditor"></script> .
Uncaught TypeError: (0 , vue__WEBPACK_IMPORTED_MODULE_0__.default) is not a function
ITjdbdjdjd的博客
10-20 7140
未捕获的类型错误： （0 ， vue__WEBPACK_IMPORTED_MODULE_0__.default） 不是一个函数。
高德地图报错 Error in mounted hook: “TypeError: AMap__WEBPACK_IMPORTED_MODULE_1___default.a.PolyEditor is
zhangyu_98的博客
09-27 781
高德地图使用 报错 引入了矢量图形 但是在引入插件的地方没有引入 需引入 插件'AMap.PolyEditor'
TypeError: AMap.Autocomplete is not a constructor
qq_44832960的博客
10-25 5145
使用vue-amap搜索控件时候出现的问题，我这边是发现项目在main.js里面引入之后，在index.html里面也有而且少了下面的控件所以才会出现的报错
vue Error in mounted hook: “TypeError: Object(...) is not a function“
小白成长记
08-04 1729
api中 function reqCase(){...} function reqList(){...} export default { reqCase, reqList } index.vue中 import { reqCase } from '@/api/mapApi.js' 解决办法： 修改api： export function reqCase(){...} export function reqList(){...} ...
Vue项目中出现 “Error in mounted hook: TypeError: handler.call is not a function”
yinge0508的博客
06-05 4740
出现该错误的原因可能是 在页面中写了一些生命周期函数，而生命周期函数里面什么都没有；没有使用的生命周期函数直接删掉；
使用vue中的created钩子出现Error in mounted hook: “TypeError: handler.call is not a function“错误
weixin_46353030的博客
07-30 2476
一、问题 使用creted:{}时出现以下报错 Error in mounted hook: “TypeError: handler.call is not a function” 二、原因 造成报错原因就是生命周期钩子函数createded: {}是否有声明了未定义方法或是只声明了钩子函数。 //只声明了钩子函数 created:{} 三、解决办法 把created: {}删除掉 把created:{}中未定义方法删除掉 把created: {}改为created(){} 参考 https:/
vue安装高德地图
张小胖
10-10 824
<scripttype="text/javascript"src="https://webapi.amap.com/maps?v=1.4.15&key='key自己申请'&plugin=AMap.MouseTool,AMap.Geolocation,AMap.ControlBar,Map3D,AMap.DistrictSearch,AMap.RangingTool,A...
评论 6
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

郭宝

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值