搜索 (AMap.AutoComplete)

用于进行 POI 搜索联想与数据查询的相关类型

提示

来源 @vuemap/vue-amap 组件库

提示

常见问题

1、搜索框中输入内容,但没有可选的下拉框出现

原因:
一、新版本的key都需要配合安全密钥使用,初始化 initAMapApiLoader 时需要配上安全密钥或安全代理
二、下拉框的默认zIndex较低,当在弹出框中使用时,结果的下拉框会被盖住。下拉框的class为 amap-sug-result, 因此需要增加 .amap-sug-result{z-index:1000}去处理
三、搜索接口的调用次数有限制,可以查看network中搜索请求,看是否超过限制

基础示例

静态属性

仅且可以初始化配置,不支持响应式。

名称类型说明
datatypeString返回的数据类型。可选值:all-返回所有数据类型、poi-返回POI数据类型、bus-返回公交站点数据类型、busline-返回公交线路数据类型目前暂时不支持多种类型
inputIdString可选参数,用来指定一个input输入框,设定之后,在input输入文字将自动生成下拉选择列表。输入框DOM对象的id值
outputIdString可选参数,指定一个现有的div的id或者元素,作为展示提示结果的容器,当指定了input的时候有效,缺省的时候将自动创建一个显示结果面板
outPutDirAutoBoolean默认为true,表示是否在input位于页面较下方的时候自动将输入面板显示在input上方以避免被遮挡
closeResultOnScrollBoolean页面滚动时关闭搜索结果列表,默认 true
langString设置检索语言类型,默认中文 'zh_cn'
inputCustomBoolean是否自定义input,自定义的时候将使用用户的inputId,默认 false
debounceNumber手动加上防抖功能,默认100毫秒
extraOptionsObject额外扩展属性,会直接将属性拷贝到初始化的options中,当key与props内的一样时会被props覆盖

动态属性

支持响应式。

名称类型说明
visibleBoolean是否显示,默认true
typeString输入提示时限定POI类型,多个类型用“
cityString输入提示时限定城市。可选值:城市名(中文或中文全拼)、citycode、adcode;默认值:“全国”
citylimitBoolean是否强制限制在设置的城市内搜索,默认值为:false,true:强制限制设定城市,false:不强制限制设定城市
placeholderString默认输入框的placeholder属性

ref 可用方法

提供无副作用的同步帮助方法

函数返回说明
$$getInstance()AMap.AutoComplete获取实例

事件

事件参数说明
selectevent鼠标点击或者回车选中某个POI信息时触发此事件
chooseevent鼠标或者键盘上下键选择POI信息时触发此事件

事件回调的event参数

参数类型说明
idStringPOI唯一标识
nameStringname
adcodeString区域编码
districtString所属区域
locationString位置
typeString类型
最后更新时间:
贡献者: gu, guyangyang, gyy