@markertap="markertap"
></map>
</view>
</template>
<script>
let map;
import { getMarketList,getMapMarketList } from "../../common/js/Api.js";
import storage from '@/common/js/storage.js'
var MARKER_INFO={height:40,width:30}
// #ifdef APP-NVUE
const currentWebview = plus.webview.currentWebview();
// #endif
export default {
data(){
return {
search :{
pn: 0,
rn: 12,
},
marketsList:[],
height:'',
width:'',
mapInfo:{
scale:16,
maxScale:17,
longitude:'116.397428',
latitude:'39.90923'
},
callout:{
content:'',
fontSize:'13',
color:'red',
textAlign:'center',
bgColor:'white',
padding:3,
display:'ALWAYS',
borderRadius:10
}
}
},
onLoad() {
map = uni.createMapContext('map', this);
uni.getSystemInfo({
success: res => {
console.log(res)
this.height =( res.windowHeight) + 'px';
this.width = res.windowWidth + 'px';
}
});
this.initFn();
},
created() {
// 监听当前窗口显示
currentWebview.addEventListener('show',e=>{
console.log('indexShow');
this.initFn();
})
},
beforeDestroy() {
// 移除监听事件
currentWebview.removeEventListener('show',e=>{})
},
methods:{
initFn(){
this.getData();
this.getSelfLocation();
},
goDetail(address_id) {
uni.navigateTo({
url: "/pages/index/pages/view?address_id=" + address_id,
});
},
markertap(e){
console.log('markertapmarkertapmarkertap',e)
this.goDetail(this.marketsList[e.detail.markerId].address_id);
},
callouttap(e){
console.log('this.marketsList[e.detail.markerId].address_id',this.marketsList[e.detail.markerId].address_id)
this.goDetail(this.marketsList[e.detail.markerId].address_id);
console.log('eeeeeee',e)
},
getSelfLocation(){
console.log('地址获取');
uni.getLocation({
type: 'gcj02',
success: res => {
console.log('地址获取成功,切换到目标点nvue', res);
this.mapInfo.latitude=res.latitude;
this.mapInfo.longitude=res.longitude;
// this.getList(res.latitude,res.longitude);
},
fail: () => {
uni.showToast({
title:'地理位置获取失败'
})
}
});
},
formatJson(list){
var arr=[]
list.forEach((e,index)=>{
let callout=Object.assign(this.callout,{content:e.market_name})
console.log(e,index)
if(!e.real_position){
return
}
var item={
'latitude': Number(e.real_position.lat) ,
'longitude': Number(e.real_position.lng) ,
'iconPath':"/static/ITkoala-amap/item.png",
id:index*1,
address_id:e.address_id,
width:MARKER_INFO.width,
height:MARKER_INFO.height,
// ,
callout:{...callout},
}
arr.push(item)
console.log('item.id',item.id)
})
return arr;
},
getData(params = {}) {
uni.showLoading({
title: "数据获取中...",
});
const user_info = storage.get('user_info') || {}
getMapMarketList({
uid:user_info.uid,
flag:1,
}).then((res) => {
console.log(res)
this.marketsList= this.formatJson(res.online_market);
uni.hideLoading();
},
(reject) => {
uni.hideLoading();
})
}
}
}
</script>
<style>
</style>
6***@qq.com (作者)
哦哦就是看到这个效果挺好的,但是使用了 其他事件冲突了
2021-03-19 15:15