vue+leaflet加載地圖根據示例代碼只引入了如下模塊:
import L from 'leaflet';
import '@supermap/iclient-leaflet';
地圖展示不完全如下:
截屏2021-11-30 下午4.12.39.png
后來發現是缺失leaflet的css引入
首先找到package.json
查看是否添加了leaflet的依賴
如果只執行了
npm install @supermap/iclient-leaflet
這個是不夠的。還需要執行
npm install leaflet
再引入leaflet.css
import "leaflet/dist/leaflet.css";
如果保存之后地圖可以顯示出來,但是刷新之后地圖又無法完整加載,就需要考慮是不是使用了tab切換,或者使用v-show之類的展示地圖。
如果是這樣的問題,需要考慮到是否是因為v-show或者他不切換時拿不到地圖DOM導致的地圖加載不完全,我將模塊v-show的控制方法,改成v-if,地圖成功展示。
在此記錄一下
截屏2021-11-30 下午4.20.54.png