vue-baidu-map，bm-polygon的click事件没有效果，是什么原因呢？

Question

vue-baidu-map，bm-polygon的click事件没有效果，是什么原因呢？

<baidu-map
      class="map"
      :center="center"
      :zoom="zoom"
      :double-click-zoom="false"
      :scroll-wheel-zoom="true"
      @ready="mapReady"
      @zoomend="mapZoomEnd"
      @touchend="mapTouchend"
    >
<bm-polygon
        ref="polygon"
        title="workstation"
        v-for="item in workstations"
        :key="item.workstationId"
        :path="item.c_coordinates"
        :stroke-color="item.valveCount > 0 ? '#85EF47' : '#647AFF'"
        :stroke-weight="2"
        :fill-color="item.valveCount > 0 ? 'rgb(133, 239, 71)' : 'rgb(100, 122, 255)'"
        :fill-opacity="0.5"
        @click="handleWsClick"
      ></bm-polygon>
</baidu-map>

 handleWsClick(e) {
      // 地块点击事件
      alert(111)
      console.log('地块点击事件-e', e)
    },

alert没有弹出，e也没有打印出来

Answer 1

我这边点击是可以触发的。
不知道你这边具体是哪里出现了问题。

以下是测试代码片段：

<template>
  <div id="app">
    <baidu-map class="map" :center="{lng: 116.404, lat: 39.915}" :zoom="15" 
      :double-click-zoom="false"
      :scroll-wheel-zoom="true">
      <bm-polygon v-for="(item,index) in polygonPath" :key="index" :path="item" stroke-color="blue" :stroke-opacity="0.5" :stroke-weight="2" :editing="true" @click="handleClick" />>
    </baidu-map>
  </div>
</template>

<script>
export default {
  data(){
    return {
      polygonPath: [
        [
          {lng: 116.386321, lat: 39.909632},
          {lng: 116.378344, lat: 39.909023},
          {lng: 116.377338, lat: 39.916826}
        ],
        [
          {lng: 116.412732, lat: 39.911707},
          {lng: 116.39455, lat: 39.910932},
          {lng: 116.403461, lat: 39.921336}
        ]
      ],
    }
  },
  methods: {
    handleClick(){
      console.log('图形被点击了')
    }
  }
}
</script>

<style>
.map{
  width: 100vw;
  height: 100vh;
}
</style>