uni-app 内置组件 map地图在鸿蒙系统版本5.0.0 中报错(急，急，急)

uni-app 内置组件 map地图在鸿蒙系统版本5.0.0 中报错(急，急，急)

示例代码：

const state = reactive({
lng: 116.404,
lat: 39.915,
scale: 16
}) 

<view style="padding-top: 32rpx;border-radius: 8rpx;height: 300rpx;" >  
<map  
style="width: 100%;height: 100%;"  
id="myMap"  
longitude="state.lng"
latitude="state.lat"
scale="state.scale"
@click="clickMap"
/>
</view>

操作步骤：

const state = reactive({
lng: 116.404,
lat: 39.915,
scale: 16
}) 

<view style="padding-top: 32rpx;border-radius: 8rpx;height: 300rpx;" >  
<map  
style="width: 100%;height: 100%;"  
id="myMap"  
longitude="state.lng"
latitude="state.lat"
scale="state.scale"
@click="clickMap"
/>
</view>

预期结果：

正常显示地图

实际结果：

如图报错，无法显示地图

bug描述


更多关于uni-app 内置组件 map地图在鸿蒙系统版本5.0.0 中报错(急，急，急)的实战教程也可以访问 https://www.itying.com/category-93-b0.html

17 回复

是鸿蒙 next 手机还是浏览器上的？

更多关于uni-app 内置组件 map地图在鸿蒙系统版本5.0.0 中报错(急，急，急)的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


手机。华为手机鸿蒙系统

bug描述 --》图片 --》是鸿蒙开发人员 连接手机app 在浏览器上调试也会报错

大佬，可以提供一个临时解决方案嘛？ 急，急，急

回复 1***@qq.com: 你是更新到最新版的吗？我这里测试的是正常的

回复 DCloud_UNI_yuhe: “dependencies”: { “@dcloudio/uni-app”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-app-plus”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-h5”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-helper-json”: “”, “@dcloudio/uni-i18n”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-360”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-alipay”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-baidu”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-jd”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-kuaishou”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-lark”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-qq”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-toutiao”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-vue”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-weixin”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-mp-xhs”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-quickapp-native”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-quickapp-webview”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-stacktracey”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-stat”: “2.0.2-alpha-3061020221121003”, “@vue/composition-api”: “^1.7.1”, “@vue/shared”: “^3.0.0”, “@zebra-ui/swiper”: “^2.2.5”, “core-js”: “^3.6.5”, “dayjs”: “^1.11.6”, “echarts”: “4.9.0”, “flyio”: “^0.6.2”, “jweixin-module”: “^1.6.0”, “regenerator-runtime”: “^0.12.1”, “uni-simple-router”: “^2.0.7”, “vue”: “^2.6.11”, “vuex”: “^3.2.0” }, “devDependencies”: { “@babel/runtime”: “~7.17.9”, “@dcloudio/types”: “^3.0.4”, “@dcloudio/uni-automator”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-cli-i18n”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-cli-shared”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-migration”: “2.0.2-alpha-3061020221121003”, “@dcloudio/uni-template-compiler”: “2.0.2-alpha-3061020221121003”, “@dcloudio/vue-cli-plugin-hbuilderx”: “2.0.2-alpha-3061020221121003”, “@dcloudio/vue-cli-plugin-uni”: “2.0.2-alpha-3061020221121003”, “@dcloudio/vue-cli-plugin-uni-optimize”: “2.0.2-alpha-3061020221121003”, “@dcloudio/webpack-uni-mp-loader”: “2.0.2-alpha-3061020221121003”, “@dcloudio/webpack-uni-pages-loader”: “2.0.2-alpha-3061020221121003”, “@vue/cli-plugin-babel”: “~4.5.19”, “@vue/cli-service”: “~4.5.19”, “axios”: “^1.2.0”, “babel-plugin-import”: “^1.11.0”, “cross-env”: “^7.0.2”, “jest”: “^25.4.0”, “js-sha1”: “^0.6.0”, “mini-types”: “”, “miniprogram-api-typings”: “*”, “postcss-comment”: “^2.0.0”, “sass”: “^1.49.8”, “sass-loader”: “^8.0.2”, “swiper”: “^5.4.5”, “uni-read-pages”: “^1.0.5”, “unplugin-vue2-script-setup”: “^0.11.3”, “vconsole”: “^3.15.1”, “vue-awesome-swiper”: “^3.1.3”, “vue-template-compiler”: “^2.6.11” },

回复 DCloud_UNI_yuhe: 不是最新版本，是uniapp vue2项目，使用"@vue/composition-api": “^1.7.1”,插件 ，编写的vue3 语法

回复 1***@qq.com: vue2 都不支持运行到鸿蒙，请明确一下你的场景

回复 DCloud_UNI_yuhe: uniapp开发的H5内嵌安卓，ios。需求是要兼容鸿蒙

回复 1***@qq.com: 你直接提供一下可以复现的项目吧

回复 DCloud_UNI_yuhe: 大佬，上传了，复现项目在评论下面

复现项目 node 16.20.2 yarn

你版本太老了，更新一下看看呢

回复 DCloud_UNI_yuhe: 更新到那个版本？老项目了，不敢盲目更新啊

回复 DCloud_UNI_yuhe: 可以提供一下更新方式嘛？最小程度影响原功能

回复 1***@qq.com: https://uniapp.dcloud.net.cn/quickstart-cli.html#install-vue-cli

在鸿蒙系统5.0.0中使用uni-app的map组件报错，这是已知的兼容性问题。目前可尝试以下解决方案：

  1. 检查基础库版本，确保使用最新版uni-app（HBuilder X 3.6+）
  2. 添加polyfill代码：
// main.js
if (typeof global === 'undefined') {
  global = {}
}
  1. 临时降级到鸿蒙4.0系统测试
  2. 使用条件编译针对鸿蒙系统做特殊处理：
<!-- #ifdef harmony -->
<web-view src="https://maps.google.com/maps?q={{state.lat}},{{state.lng}}"></web-view>
<!-- #else -->
<map style="width:100%;height:300rpx;" 
     :longitude="state.lng" 
     :latitude="state.lat" 
     :scale="state.scale">
</map>
<!-- #endif -->
回到顶部