控件綁定對(duì)應(yīng)的事件函數(shù)酪穿。
在index.wxml中添加一個(gè)bindcontroltap
屬性猛频,賦值一個(gè)函數(shù)名
bindcontroltap='controltaps'
在index.js中定義一個(gè)controltap函數(shù)
//控件被點(diǎn)擊事件
controltaps: function (e) {
console.log(e)
},
可以看出哪一個(gè)控件被點(diǎn)擊了骡楼。
可以根據(jù)前面設(shè)置的controlId來(lái)對(duì)相應(yīng)的控件執(zhí)行相對(duì)應(yīng)的操作蒋院。
onReady函數(shù)
在onload函數(shù)執(zhí)行結(jié)束后哼勇,即頁(yè)面渲染結(jié)束后就會(huì)執(zhí)行這個(gè)函數(shù)炸庞。
可以將頁(yè)面渲染結(jié)束后的地圖位置信息保存在這個(gè)函數(shù)里
查看微信小程序文檔API,
創(chuàng)建并返回 map 上下文 mapContext 對(duì)象。在自定義組件下翠勉,第二個(gè)參數(shù)傳入組件實(shí)例this妖啥,以操作組件內(nèi) <map/> 組件
wx.createMapContext(mapId, this)
onReady:function(res){
this.mapCtx=wx.createMapContext("mymap")
}
注意:"mymap"是指map標(biāo)簽的id,所以需要給map添加一個(gè)id屬性
id='mymap'
回到原來(lái)位置
控件的id為4,所以cid==4時(shí)調(diào)用moveToLocation返回當(dāng)前位置
//控件被點(diǎn)擊事件
controltaps: function (e) {
var cid = e.controlId;
if(cid==4){
this.mapCtx.moveToLocation();
}
console.log(cid);
},
注意:這里需要設(shè)置map的屬性show-location='true'
;
此時(shí)就可以拖動(dòng)地圖对碌,然后點(diǎn)擊控件4就可以返回到原來(lái)的位置荆虱。這時(shí)候可以在原來(lái)的位置加一個(gè)控件,表示這是原來(lái)的位置
{
id: 5,
iconPath: '/img/location.png',
position: {
width: 30,
height: 30,
left: windowWidth / 2 - 15,
top: windowHeight /2 - 26
}
}
此時(shí)可以隨便的拖動(dòng)地圖朽们,然后點(diǎn)擊地圖回到原來(lái)的位置怀读。