文章目录
一、地图弹窗二、监听地图搜索事件一、地图弹窗
<el-dialog title="选择地图" :visible.sync="dialogFormVisibleMap" width="60%" :close-on-click-modal="false"><iframe id="mapPage" width="100%" height="100%" frameborder=0 src="https://apis./tools/locpicker?search=1&type=1&key=yourkey&referer=myapp"></iframe><div slot="footer" class="dialog-footer"><el-button @click="dialogFormVisibleMap = false">关 闭</el-button></div></el-dialog>
二、监听地图搜索事件
window:addEventListener('message', function(event) {// 接收位置信息,用户选择确认位置点后选点组件会触发该事件,回传用户的位置信息var loc = event.data;if (loc && loc.module == 'locationPicker') {//防止其他应用也会向该页面post信息,需判断module是否为'locationPicker'console.log('location', loc);mainVm.entity.longitude = loc.latlng.lngmainVm.entity.latitude = loc.latlng.latmainVm.dialogFormVisibleMap=false;}}, false),