Javascript Vue路由器在传单弹出窗口中工作不正常

Javascript Vue路由器在传单弹出窗口中工作不正常,javascript,vue.js,vuejs2,leaflet,vue2leaflet,Javascript,Vue.js,Vuejs2,Leaflet,Vue2leaflet,我正在代码库中使用vue2传单包装器将传单和Vue组合在一起。目前,我遇到了一个问题,我试图让Vue$router在传单弹出窗口中工作。这就是我的代码现在的样子 <template> <l-map> <l-tile-layer :url="url" /> <l-marker v-for="point in points" :key="point.id"

我正在代码库中使用
vue2传单
包装器将传单和Vue组合在一起。目前,我遇到了一个问题,我试图让Vue
$router
在传单弹出窗口中工作。这就是我的代码现在的样子

<template>
  <l-map>
    <l-tile-layer :url="url" />
    <l-marker
      v-for="point in points"
      :key="point.id"
      :lat-lng="point.latLng"
      :icon="point.icon"
    >
      <l-popup :content="displayInfo(point)"/>
    </l-marker>
  </l-map>
</template>
<script>
...
    displayInfo(point) {
      // how it usually works: this.$router.push({ name: 'point', params: { id: point.id } })
     
      // Attempt 1
      // return '<div onclick="routeToPage(' + point.id + ')">' + point.id + '</div><br/>' + point.subject

      // Attempt 2
      // return '<div @click="routeToPage(' + point.id + ')">' + point.id + '</div><br/>' + point.subject

      // Attempt 3
      // return '<router-link to="{ name: \'point\', params: { id: ' + point.id + ' } }">' + point.id + '</router-link><br/>' + point.subject;

      return point.id + '<br/>' + point.subject;
    },

    routeToPage(id) {
      return this.$router.push({ name: 'point', params: { id }
    }

...
</script>
尝试2 单击id不会执行任何操作,也没有任何行为。它看起来就像是普通文本。在检查中,它只是显示

<div class="leaflet-popup-content" style="width: 301px;">
    <div @click="routeToPage">39105</div><br>
    Aliquid voluptas animi facilis ipsum ducimus doloremque consequatur nemo porro perferendis atque dolorum quo adipisci perferendis magnam
</div>

39105
同侧脸上的非流动性面部表情是一种巨大的面部表情
尝试3次

<div class="leaflet-popup-content" style="width: 301px;">
    <router-link to="{ name: 'point', params: { id: 39105 } }">39105</router-link><br>
    Aliquid voluptas animi facilis ipsum ducimus doloremque consequatur nemo porro perferendis atque dolorum quo adipisci perferendis magnam
</div>

39105
同侧脸上的非流动性面部表情是一种巨大的面部表情
所有这些似乎都无法从文本中创建链接,甚至无法将其注册为路由。你知道我做错了什么吗


如果您需要我提供更多信息,或者这不是我问题的清晰描述,请告知我。

您可能应该将弹出窗口的内容如下所示:

<l-popup>
  <div @click= ....> </div>
</l-popup>


这样,vue会将带有
@单击的div解释为模板。如果你把它放在
:content
,它就被认为是文本。

我甚至没有想到我可以通过
:content
以外的任何方式将内容添加到此中。非常感谢你!这简直要了我的命!
<l-popup>
  <div @click= ....> </div>
</l-popup>