el-amap-marker添加点击事件用@click不生效

最新推荐文章于 2024-04-19 01:59:38 发布

zdh信念

最新推荐文章于 2024-04-19 01:59:38 发布

阅读量259

点赞数

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/weixin_44074685/article/details/134823487

版权

给el-amap-marker添加点击事件需要用另一种方法

<el-amap-marker @mousedown.prevent 
    v-for="(marker, index) in labelMarkers" :key="index"
    :position="marker.position"
    :events="marker.events">
</el-amap-marker>

:events="marker.events"

将events添加到labelMarkers中

<script>
    export default{
        data(){
            labelMarkers:[
            {
                name:"xx位置"，
                position:[110,39],
                events: {
                        click() {
                           console.log("输出内容")
                        }
                    }
            },
            ]
        }
    }
<script>

或者如下例子

//在methods中写入如下方法
 point() {
            let markers = [];
            let that = this
            let pointMarker = this.labelMarkers
            console.log('pointerMarker', pointMarker)
            pointMarker.forEach((item, index) => {
                markers.push({
                    position: item.position,
                    name: item.name,
                    equipCode: item.equipCode,
                    location: item.location,
                    status: item.status,
                    lxghsj: item.lxghsj,
                    nextLxghsj: item.nextLxghsj,
                    waterQuality: item.waterQuality,
                    events: {
                        click() {
                            
                            that.number = item.equipCode
                            that.community = item.name
                            that.position = item.location
                            that.state = item.status
                            that.waterQuality = item.waterQuality
                            that.replacementTime = item.lxghsj
                            that.nextReplacementTime = item.nextLxghsj
                        }
                    }
                })
                console.log('aaa', markers)
            })
            //  加点
            console.log(markers)
            this.labelMarkers = markers;

        },
//之后在mounted中加入
            this.point()