效果图：

image.png

步骤一：先在最外成html挂载行政区域所用的代码

        <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.15&key=你的高德地图key值&plugin=Map3D,ElasticMarker,AMap.Geocoder,AMap.Geolocation,AMap.Driving,AMap.DistrictSearch"></script>

步骤二：直接赋值代码：

<template>
    <div class="map" id="map"></div>
</template>

<script>
    import AMap from "AMap";
    export default {
        data() {
            return {
                weXinAmapMap: null,
            };
        },

        watch: {},

        created() {},

        mounted() {
            this.mapInit('map');
        },
        methods: {

            mapInit(domName) {
                let _self = this;
                let domDiv = domName || 'map'
                _self.weXinAmapMap = new AMap.Map(domDiv, {
                    center: [118.54436,33.011971],
                    mapStyle: "amap://styles/1610afaf5f3e06b9757b81fce626e050",
                    zooms: [1, 18],
                    zoom: 9.6,
                });
                AMap.event.addListener(_self.weXinAmapMap, "click", function(e) {
                    var x = e.lnglat.getLng();
                    var y = e.lnglat.getLat();
                });
                _self.drawDistrictBorder();
            },
            /*
             *@description:绘制盱眙县的区域边界图
             *@date: 2020-09-20 14:42:15
             */
            drawDistrictBorder() {
                let _self = this;
                //加载行政区划插件
                var district = null;
                var opts = {
                    subdistrict: 0, //获取边界不需要返回下级行政区
                    extensions: "all", //返回行政区边界坐标组等具体信息
                    level: "district", //查询行政级别为 市
                };
                district = new AMap.DistrictSearch(opts);
                //设置行政区
                district.setLevel("district");
                district.search("盱眙县", function(status, result) {
                    var polygons = [];
                    var bounds = result.districtList[0].boundaries;
                    if (bounds) {
                        for (var i = 0, l = bounds.length; i < l; i++) {
                            //生成行政区划polygon
                            var polygon = new AMap.Polygon({
                                strokeWeight: 3,
                                strokeColor: "#00F6FF",
                                path: bounds[i],
                                fillColor: '#00F6FF',
                                fillOpacity: 0.1,
                            });
                            polygons.push(polygon);
                        }
                    }
                    _self.weXinAmapMap.add(polygons);
                });
            },
        }
    };
</script>

<style scoped>
    .map {
        margin-left: 20px;
        width: 776px;
        height: 600px;
    }
</style>

祝君安好~

另，因为文章写得匆忙，若无法显示的及时留言，看到回复