默认是加载4.x的api在线连接。使用3.x的api需要手动调用链接。
1. template
部分,需要绑定id,和纯js的相同
<template>
<div id="map"></div>
</template>
2. 导包部分
import { loadScript, loadCss, loadModules } from 'esri-loader'
3. export
接口部分
export default {
name: 'web-map',
mounted() {
loadScript({ url: 'https://js.arcgis.com/3.28/' })
loadCss('https://js.arcgis.com/3.28/esri/css/esri.css')
loadModules(['esri/map', 'esri/geometry/Extent', 'esri/layers/ArcGISDynamicMapServiceLayer', 'dojo/domReady!'], { css: true })
.then(([Map, Extent, ArcGISDynamicMapServiceLayer]) => {
var tjUAVurl = 'http://localhost:6080/arcgis/rest/services/shopping/payMon_zenzhag/MapServer'
var map = new Map('map', {
logo: false
})
var tjUAVLayer = new ArcGISDynamicMapServiceLayer(tjUAVurl)
map.addLayer(tjUAVLayer)
})
},
beforeDestroy() {
if (this.view) {
this.view.container = null
}
}
}