1. 普通的onclick传递对象
var user = {id:1, name:'zs', age:20};
var ele = '<a οnclick="edit(' + JSON.stringify(user).replace(/"/g, '"') + ');">修改</a>';
或者
var ele = '<a οnclick="edit(\'' + JSON.stringify(user).replace(/"/g, '"') + '\');">修改</a>';
前者取到的是json对象,后者取到的是json字符串。
2. 模板字符串中传递对象
this.groupDeviceListData.forEach((item) => {
let marker = new AMap.Marker({
map: this.map,
zIndex: 9999999,
position: [item.longitude, item.latitude],
// w这里用来显示你需要自定义的图标 这里使用三目运算就比较方便了
icon: new AMap.Icon({
image:
item.status == 1
? require("@/assets/images/online.png")
: require("@/assets/images/offline.png"),
// imageSize: [64, 64], // 类似bacrground-size 大小
size: [64, 64], // 图标尺寸 默认[36,36]
}),
});
let status = "";
let i = JSON.stringify(item).replace(/"/g, """);
// i.push(item);
console.log(i);
status = item.status == 1 ? "在线" : "离线";
marker.content = `<div class="deviceBox">
<div class="deviceBox-header">
${item.device_name}
</div>
<div class="deviceBox-con">
<p><span>回路数量</span><em class="right"> ${item.loop_list.length}</em></p>
<p><span>状态</span><em class="right"> ${status}</em></p>
<p><span>经纬度</span><em class="right"> ${item.longitude} , ${item.latitude}</em></p>
</div>
<span class="loopBtn" onclick="singleLoop('${i}')">回路控制</span>
</div>`;
marker.on("mouseover", this.infoOpen);
//注释后打开地图时默认关闭信息窗体
// marker.on("mouseout", infoClose);
// marker.on("click", newMAp);
this.map.add(marker);
});