高德地图点击锚点后,路由携值跳转


   // 这里是获取marker的数据,可以省略不看,取到值就可以了
     getKanban01Info() {
      getWebhome({
        user_id: this.$store.getters.user_id
      }).then(res => {
        //接口返回的marker值
        this.kanbanData = res.data.stationList
        //循环取值
        let stations = this.kanbanData.forEach(item => {
        	//传参
          this.addStationMarker(item.station_long, item.station_lat, item.station_id)
        })
      })
    },
 //地图添加marker
    addStationMarker(station_long, station_lat,station_id) {
      let marker = new AMap.Marker({
        icon: require('/icon.png'), // 自定义点标记
        position: [station_long, station_lat], // 基点位置
        offset: new AMap.Pixel(0, 0), // 设置点标记偏移量
        anchor: 'bottom-center', // 设置锚点方位
        extData: { 'station_id': station_id } //自定义添加的新值,使用extData方法
      })
	  //marker添加点击事件方法
      marker.on('click', this.markerClick)

      this.mapMarker.station.push(marker)
      this.map.add(marker)
    },
    markerClick(e) {
  	  // 取参数e里的内容,用getExtData()方法接收extData的值
      let routerNum = e.target.getExtData().station_id
      this.$router.push({
      	//跳转的路由
        path: '/elevator/building',
        //路由传参时push和query搭配使用 ,作用时传递参数
        query: {           
          stationId: routerNum
        }
      })
    }

跳转后的页面接收值

	mounted() {
	    this.getstation()
	    //接受值,this.$route.query.stationId就是传过来的值
	    this.ruleForm.value = this.$route.query.stationId
	    console.log(this.ruleForm.value, '查看接受传过来的值')
  }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值