uni-app引入地图map组件--APP开发

需求场景：使用uni-app地图组件，实现APP开发
开发环境：Mac，HbuildX3.4.14
测试环境：iOS真机调试

一、流程

• 1、关于Uini-app的map组件：官方文档说明。map组件是原生组件，目前只针对原生APP开发，因此通过app-nvue实现，同时选择的地图服务商只能是高德地图。

• 2、创建高德地图应用，获取APP_Key：(APP需要单独配置iOS和Android应用key)

  • 高德-iOS配置教程
  • 高德-Android配置教程
  • 注：申请APP_Key的Android的包名和iOS的BundleID和证书信息及项目基本配置一致。否则会出问题。地图空白或者报错时优先排查配置。

• 3、项目配置

  • APP模块配置：manifest.json文件 --> APP模块配置 --> Map(地图，只能选一个) --> 勾中高德地图， 配置appkey_ios与appkey_android
  • APP权限配置：manifest.json文件 --> App权限配置 分别配置Android和iOS权限。iOS提供相关提示文案。

• 4、运行
  • 配置完成之后，重新创建APP基座，删除设备上已存在的安装包(之前已安装)，重新运行。

// location-setting-map.nvue

<template>
	<view class="view-container">
		<view class="view-map-contaier">
			<map id="map" style="width: 750rpx; height: 500px;background-color: #ff0000;" :latitude="latitude" :longitude="longitude">
				
			</map>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				latitude:40.013305,
				longitude:118.685713,
			}
		},
		onLoad() {
			
		},
		
		onReady() {
			
			this.createMap()
		},
		
		methods: {
			createMap() {

			}
		}
	}
</script>

<style>
	.view-container {
		
	}
	.view-map-contaier {
		width: 750rpx;
		height: 500px;
		background-color: aqua;
	}
	.view-map-item {
		
	}
</style>

二、问题

• 1、地图Map组件空白，不报错

地图组件加载，但是没有地图内容。因为bundleID和高德配置的不一致导致的。另外配置默认经纬度，否则显示也会有一点问题。

• 2、“HTML5+Runtime” – 打包时未添加Maps模块，请参考https://ask.dcloud.net.cn/article/283

在问题1解决之后，出现了问题2。提示给出的文章链接，文章并没有解决问题，或者说遇到的问题不大相同。文章中说的模块之前都已经配置，相关的key也排查过没有问题。

最终解决方法是：删除设备上的安装包，重新打包运行基座。

具体原因还有待确认：