vue启用百度搜索地形图API键入提醒开启往下拉目

摘要: 处理难题后的页面实际效果图:在开发设计中,获得百度搜索地形图API,键入重要词时开启往下拉目录时需碰到的难题:看看图用的实例是:jsdemo.htm#a6_2// 百度搜索地形图API作用functi...

处理难题后的页面实际效果图:

在开发设计中,获得百度搜索地形图API,键入重要词时开启往下拉目录时需碰到的难题:看看图


用的实例是:jsdemo.htm#a6_2

// 百度搜索地形图API作用
 function G(id) {
 return document.getElementById(id);
 var map = new BMap.Map( l-map 
 map.centerAndZoom( 北京市 ,12); // 原始化地形图,设定大城市和地形图级別。
 var ac = new plete( //创建一个全自动进行的目标
 { input : suggestId 
 , location : map
 ac.addEventListener( onhighlight , function(e) { //电脑鼠标放到往下拉目录上的恶性事件
 var str = 
 var _value = e.fromitem.value;
 var value = 
 if (e.fromitem.index -1) {
 value = _value.province + _value.city + _value.district + _value.street + _value.business;
 str = FromItem
index = + e.fromitem.index + 
value = + value;
 value = 
 if (e.toitem.index -1) {
 _value = e.toitem.value;
 value = _value.province + _value.city + _value.district + _value.street + _value.business;
 str += 
ToItem
index = + e.toitem.index + 
value = + value;
 G( searchResultPanel ).innerHTML = str;
 var myValue;
 ac.addEventListener( onconfirm , function(e) { //电脑鼠标点一下往下拉目录后的恶性事件
 var _value = e.item.value;
 myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
 G( searchResultPanel ).innerHTML = onconfirm
index = + e.item.index + 
myValue = + myValue;
 setPlace();
 function setPlace(){
 map.clearOverlays(); //消除地形图上全部遮盖物
 function myFun(){
 var pp = local.getResults().getPoi(0).point; //获得第一个智能化检索的結果
 map.centerAndZoom(pp, 18);
 map.addOverlay(new BMap.Marker(pp)); //加上标明
 var local = new BMap.LocalSearch(map, { //智能化检索
 onSearchComplete: myFun
 local.search(myValue);

下边得出自身处理的方式:

html编码:

 plete

JS编码:

export default {
 name: recover-page ,
 data () {
 return {
 addressDetail : null,
 adderss : ,
 map: null,
 local: null,
 restaurants: []
 props: {},
 watch: {
 addressDetail(val) {//监视addressDetail的转变
 this.local.search(val);
 computed: {},
 methods: {
 querySearch(queryString, cb) {
 let restaurants = [];
 restaurants = this.restaurants;
 let results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
 // 启用 callback 回到提议目录的数据信息
 cb(results);
 createFilter(queryString) {
 /*return (restaurant) = {
 return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
 };*/
 return (restaurant) = {
 return restaurant
 loadAll() {
 return this.restaurants;
 handleSelect(item) {
 console.log( item ,item);
 this.map.clearOverlays();
 this.addressDetail = item.address;
 const pp = item.point;
 this.map.centerAndZoom(pp, 15);
 this.map.addOverlay(new BMap.Marker(pp));
 baiduMap : function () {
 //let map = new BMap.Map( allmap 
 let _this = this;
 _this.map.centerAndZoom( 广州市 ,12); // 原始化地形图,设定大城市和地形图级別。
 let geolocation =new BMap.Geolocation();
 geolocation.getCurrentPosition(function(r){
 if (this.getStatus()==BMAP_STATUS_SUCCESS) {
 let mk=new BMap.Marker(r.point);
 _this.map.addOverlay(mk);
 _this.map.panTo(r.point);
 //alert( 您的部位: +r.point.lng+ , +r.point.lat);
 }else {
 //alert( 您的手机上不兼容精准定位服务 
 _this.local = new BMap.LocalSearch(_this.map, {
 onSearchComplete: function(results){
 // 分辨情况是不是恰当
 if (_this.local.getStatus() == BMAP_STATUS_SUCCESS){
 _this.restaurants = [];
 for (let i = 0; i results.getCurrentNumPois(); i ++){
 _this.restaurants.push(results.getPoi(i));
 //_this.local.search(_this.addressDetail);
 components: {
 beforeCreate() {
 created() {
 mounted() {
 this.map = new BMap.Map( allmap 
 this.$nextTick(()= {
 let t1 = setTimeout(()= {
 this.baiduMap();
 clearTimeout(t1)
 },10);
 this.loadAll();
 beforeMount() {
 beforeUpdate() {
 updated() {
 activated() {
 deactivated() {
 beforeDestroy() {
 destroyed() {
 errorCaptured() {

嗯,难题处理!

打赏主播创作者 关注()


联系我们

全国服务热线:4000-399-000 公司邮箱:343111187@qq.com

  工作日 9:00-18:00

关注我们

官网公众号

官网公众号

Copyright?2020 广州凡科互联网科技股份有限公司 版权所有 粤ICP备10235580号 客服热线 18720358503

技术支持:知识付费小程序