我将从函数中加载弹出窗口的内容。每次单击标记时,我想更改弹出窗口的内容。 我该怎么办?
以下代码仅创建一次内容。
html:
<template>
<div>
<l-map :zoom="zoom" :center="center" style="height:500px">
<l-tile-layer :url="url" :attribution="attribution"/>
<l-marker :lat-lng="marker">
<l-popup :content="String(randomNumber())"/>
</l-marker>
</l-map>
</div>
</template>
脚本:
import { LMap, LTileLayer, LMarker, LPopup } from 'vue2-leaflet';
import 'leaflet/dist/leaflet.css'
export default {
name: 'example',
components: {
LMap,
LTileLayer,
LMarker,
LPopup,
},
data () {
return {
zoom:11,
center: L.latLng(52.376705, 4.894046),
url:'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
attribution:'© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
marker: L.latLng(52.37, 4.89),
}
},
methods: {
mounted() {
randomNumber: function () {
return String(Math.random())
}
}
}