高德地图Error: Invalid Object: LngLat(NaN, NaN)报错

最新推荐文章于 2024-09-23 10:48:59 发布

用户昵称已存在

最新推荐文章于 2024-09-23 10:48:59 发布

阅读量323

点赞数 3

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/weixin_54231578/article/details/140626037

版权

报错信息：

这个报错一开始出现的莫名奇妙，不清楚哪里触发的，找了解决答案，很多都是设置高度就能解决问题。例如：

试了下跟着设了高宽

<template>
  <div class="app-container">
    <el-form ref="queryForm" size="small" :inline="true" label-width="68px">
      <el-form-item label="车辆">
        <el-input style="width: 200px;" v-model="queryParams.vehicleNo" placeholder="请输入"
                  clearable
                  @keyup.enter.native="handleQuery"/>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
      </el-form-item>
    </el-form>
    <div id="container" style="height: 750px; width: 100%"></div>
  </div>
</template>

结果无效（有些页面应该可以解决），后来同事也有类似问题，说滚动就会报错（有两个map页面，切换后滚动），其他页面数据过多，出现滚动条就会报错。

解决方案:

设置绝对定位，终于解决了。

<template>
  <div class="app-container" style="position: absolute;height: 750px; width: 100%">
    <el-form ref="queryForm" size="small" :inline="true" label-width="68px">
      <el-form-item label="车辆">
        <el-input style="width: 200px;" v-model="queryParams.vehicleNo" placeholder="请输入"
                  clearable
                  @keyup.enter.native="handleQuery"/>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
      </el-form-item>
    </el-form>
    <div id="container" style="position: relative; height: 100%; width: 100%"></div>
  </div>
</template>