【vue baidu-map】解决更新数据,bm-marker显示不完全问题

news2024/12/23 17:49:55

实现效果:

问题:切换上面基地tab键,导致地图图标展示不完全;刷新页面就可以正常展示。判断是<bm-marker>标记元素没有动态刷新dom元素引起的问题。

方案:this.$nextTick({})

      this.$nextTick(()=>{
      this.equipmentList.forEach(item => {
        if (item.category === index && item.point) {
          var obj = {
            position: {
              lng: item.point.split(",")[0],
              lat: item.point.split(",")[1]
            },
            icon: {
              url: iconPath,
              size: { width: 33, height: 33 },
              opts: {
                imageSize: { width: 33, height: 33 }
              }
            }
          };
          this.markerList.push(obj);
         
        }
      });
      console.log(this.markerList, "当前设备的标注点列表");        
      })

上面代码功能是每次切换右侧设备列表获取新的地图标注点,将获取markerList的代码放在this.$nextTick({})里面即可。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1836133.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

多网页登录Cookie免登通俗理解

背景&#xff0c;现在有A、B两个系统&#xff0c;其中B是乾坤框架的微前端&#xff0c;里面又有若干可以单独运行的系统C、D、E、F&#xff0c;现在的目标是&#xff0c;如果没有登录过其中任一系统&#xff0c;则需要跳转登录页登录&#xff0c;登录后&#xff0c;所有的A-F都…

threejs材质的贴图(四)

效果 代码实现 import ./style.css import * as THREE from three import { OrbitControls } from three/examples/jsm/controls/OrbitControls.js//相机轨道控制器 import { RGBELoader } from "three/examples/jsm/loaders/RGBELoader.js"//加载hdr文件作为环境贴…

如何训练AI大模型?熬夜爆肝整理大全

随着人工智能技术的快速发展&#xff0c;大型预训练模型在自然语言处理、计算机视觉、语音识别等领域取得了显著成果。这些模型通过在海量数据上进行预训练&#xff0c;能够捕捉到丰富的特征信息&#xff0c;为各种下游任务提供强大的支持。然而&#xff0c;训练AI大模型面临着…

船舶能源新纪元:智能管理引领绿色航运潮流

在蓝色的大海上&#xff0c;无数船只乘风破浪&#xff0c;为全球的贸易和文化交流贡献着力量。然而&#xff0c;随着环保意识的提升和可持续发展的要求&#xff0c;船舶的能源消耗和排放问题逐渐成为了人们关注的焦点。在这个关键时刻&#xff0c;船舶能源管理系统应运而生&…

山体滑坡监测利器:传感器与智能监测平台的应用

山体滑坡&#xff0c;这一地质灾害的代名词&#xff0c;指的是山坡上的土体或岩体在重力作用下&#xff0c;因自然或人为因素而向下滑动的现象。滑坡具有突发性、隐蔽性、危害性和破坏性等特征&#xff0c;因此&#xff0c;对于山体滑坡的监测工作显得尤为重要。本文将探讨山体…

鸿蒙开发网络管理:【@ohos.request (上传下载)】

上传下载 说明&#xff1a; 本模块首批接口从API version 6开始支持。后续版本的新增接口&#xff0c;采用上角标单独标记接口的起始版本。 导入模块 import request from ohos.request;限制与约束 默认支持https&#xff0c;如果要支持http&#xff0c;需要在config.json里…

C++ 21 之 将成员属性设置为私有

c21将成员属性设置为私有.cpp #include <iostream> using namespace std; #include <string>class person08{ private:string p_name;int p_age;int p_pwd; public:// 设置名字void setName(string name){p_name name;}// 获取名字string getName(){return p_nam…

数据结构习题

第一章 绪论 与数据元素本身的形式、内容、相对位置、个数无关的是数据的 逻辑结构。 第二章 线性表 在一个有127个元素的顺序表中插入一个新元素并保持原来顺序不变&#xff0c;平均要移动的元素个数为 63.5。 n/2 单链表的存储密度 小于1。 创建一个包括n个结点的有序单链…

AI在线免费视频工具2:视频配声音

1、视频配声音 https://deepmind.google/discover/blog/generating-audio-for-video/ https://www.videotosoundeffects.com/ &#xff08;免费在线使用&#xff09;

6-18作业

作业1&#xff1a; mywidget.h #ifndef MYWIDGET_H #define MYWIDGET_H#include <QWidget> #include <QLabel> #include <QMessageBox>QT_BEGIN_NAMESPACE namespace Ui { class myWidget; } QT_END_NAMESPACEclass myWidget : public QWidget {Q_OBJECTpu…

2024/06/18--代码随想录算法8/17| 股票问题

121.买卖股票的最佳时机 力扣链接 动规五部曲 确定dp数组&#xff08;dp table&#xff09;以及下标的含义 dp[i][0] 表示第i天持有股票所得最多现金,dp[i][1] 表示第i天不持有股票所得最多现金确定递推公式 dp[i][0] max(dp[i-1][0], -price[i]) dp[i][1]max(dp[i-1][1], …

高压防触碰预警装置,工期重要还是命重要?

“说了多少遍了&#xff0c;不要在高压线下赶工期”吊车违规施工碰撞到高压线&#xff0c;导致供电线路跳闸停电事故&#xff0c;现场火花四溅及其危险&#xff0c; 高压线路被外力破坏的情况&#xff0c;违规施工、赶工期、视觉盲区导致线路外破等情况&#xff0c;想必大家也…

【小白专用24.6.18】C# SqlSugar:连接数据库实现简单的,增、删、改、查

【小白专用 已验证24.6.18】C# SqlSugar操作MySQL数据库实现增删改查-CSDN博客 通过NuGet包管理器搜索SqlSugar&#xff08;MySql还要安装MySql.Data、Newtonsoft.Json&#xff09;包并安装 SqlSugarClient db new SqlSugarClient(new ConnectionConfig(){ConnectionString …

范式(上)-第一范式(1NF)、第二范式(2NF)、第三范式(3NF)、可用关系模式

一、范式的作用 根据关系模式间属性的数据依赖来评价关系模式的好坏 以下我们将基于函数依赖的范围内来讨论范式 二、范式的定义 1、数据依赖满足一定约束的关系模式是范式 2、范式是符合某一级别的关系模式的集合&#xff0c;关系模式R为第几范式可记为 三、第一范式&am…

【Java】已解决com.mysql.cj.jdbc.exceptions.CommunicationsException异常

文章目录 一、分析问题背景二、可能出错的原因三、错误代码示例四、正确代码示例五、注意事项 已解决com.mysql.cj.jdbc.exceptions.CommunicationsException异常 一、分析问题背景 com.mysql.cj.jdbc.exceptions.CommunicationsException是Java程序在使用MySQL Connector/J与…

Docker(三)-Docker常用命令

1.run run命令执行流程:2.帮助启动类命令 2.1 启动docker systemctl start docker2.2 停止docker systemctl stop docker2.3 重启docker systemctl restart docker2.4查看docker状态 systemctl status docker2.5开机启动 systemctl enable docker2.6查看docker概要信息 …

ch552g使用torch-pad测试触摸按键遇到的问题

基本工作原理 通过设置好功能在寄存器和控制寄存器检测引脚输入的值。 实际检测阶段分为3个步骤&#xff1a;第一阶段&#xff1a;选择需要检测的阶段&#xff0c;选择扫描周期1或2ms&#xff0c;开启触摸按键中断&#xff0c;然后在87us内为充电准备阶段&#xff0c;87us内数…

第二十三篇——香农第二定律(二):到底要不要扁平化管理?

目录 一、背景介绍二、思路&方案三、过程1.思维导图2.文章中经典的句子理解3.学习之后对于投资市场的理解4.通过这篇文章结合我知道的东西我能想到什么&#xff1f; 四、总结五、升华 一、背景介绍 对于企业的理解&#xff0c;扁平化的管理&#xff0c;如果从香农第二定律…

ORA-12560: TNS:协议适配器错误

项目场景&#xff1a; 由于最近一直没有连接oracle&#xff0c;然后之前windows也是正常可以启动oracle&#xff0c;正常连接。无论是SQL Developer还是SQL PLUS命令&#xff0c;都能正常连接和操作。 问题描述 这两天刚好用SQL Developer工具连接&#xff0c;然后报错&#…

【Java毕业设计】基于SpringBoot开发的图书馆管理系统

文章目录 摘 要目录1 绪论1.1 课题背景和意义1.2 国内外研究现状1.2.1 国外研究现状1.2.2 国内研究现状 1.3 课题主要内容 2 开发相关技术介绍2.1 系统开发环境2.2 系统开发技术2.2.1 Spring Boot框架2.2.2 MySQL数据库2.2.3 MVC模式 3 系统规划3.1 初步调查分析3.2 可行性分析…