百度地图-鼠标点击下拉列表隐藏问题

需求描述:

       详情页面显示已有地址和地图时,自动完成搜索下拉框会显示出来,预期效果:详情页面时不显示下拉框,点击编辑到编辑页面,可输入下拉框进行地址选择。

百度地图-鼠标点击下拉列表隐藏问题

 

代码: 

html:
<div id="map-content"></div>



vue:
mounted() {
    let _This = this;
    _This.init(); // 调用页面初始化函数
    _This.contentMap = new BMap.Map("map-content");
    let map = _This.contentMap;
    map.enableScrollWheelZoom(true); // 缩放
    map.enableContinuousZoom(); //  开启连续缩放效果
},

methods:{
    init(){
        ajax({
            url:'',
            method:'get',
            success:function(){
                // 处理初始化数据
                 this.fSearchAddressByAddress(); // 渲染地图
                 this.addressAutocomplete(); // 自动检索实例化
            }
        })
    }

        fSearchAddressByAddress(msize) {
            let _This = this;
            let addressText = _This.address;
            let map = _This.contentMap;

            map && addressText && _This.fLocationCity(addressText, function (addressText) {
                msize = msize || 12;
                //var map =_This.contentMap;//***************
                var localSearch = new BMap.LocalSearch(map);
                localSearch.setSearchCompleteCallback(function (searchResult) {
                    if (!searchResult) {
                        return false;
                    } else {

                        var poi = searchResult.getPoi(0);
                        _This.mapPoint = poi;
                        _This.fGetSpecificAddress(poi.point);
                        map.centerAndZoom(poi.point, msize);
                        map.clearOverlays();
                        var marker = new BMap.Marker(new BMap.Point(poi.point.lng, poi.point.lat)); // 创建标注,为要查询的地方对应的经纬度
                        map.addOverlay(marker);
                        var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>" + addressText + "</p>");
                        marker.openInfoWindow(infoWindow);
                        marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画

                    }


                });
                localSearch.search(addressText);
            });
        }

        /**
        * 诊所地址 自动检索实例化
        */
        addressAutocomplete() {
            let _This = this;
            let map = _This.contentMap;
            _This.autoDrop = new BMap.Autocomplete( //建立一个自动完成的对象
                {
                    "input": "suggestId",
                    "location": map
                });
            _This.autoDrop.addEventListener("onconfirm", function (e) { //鼠标点击下拉列表后的事件
                let currentSelect = e.item.value;
                _This.addressinput = currentSelect;
                let selectValue = currentSelect.province + currentSelect.city + currentSelect.district + currentSelect.street + currentSelect.business;
                //_This.$refs.dropaddress.innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + selectValue;
                //console.log("selectValue------>",selectValue);
                _This.address = selectValue;
                _This.fSearchAddressByAddress(18);
            });
            document.getElementById('suggestId').value = _This.address;
        },

}