map.vue 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. <template>
  2. <web-view :src="h5Url" @message="handleH5Message" style="width: 100vw; height: 100vh;"></web-view>
  3. </template>
  4. <script setup lang="ts">
  5. import { ref, watch } from 'vue'
  6. import { onLoad } from '@dcloudio/uni-app';
  7. // 接收参数
  8. const getCbfbmjump = ref('')
  9. const pageType = ref('')
  10. const dsType = ref('')
  11. // H5 地址(一开始为空,等参数拿到再赋值)
  12. const h5Url = ref('')
  13. // ==============================================
  14. // 🔥 核心修复:等两个参数都拿到,再拼接 URL
  15. // ==============================================
  16. watch(
  17. [getCbfbmjump, pageType, dsType],
  18. ([cbfbm, type, dsType]) => {
  19. if (cbfbm && type && dsType) {
  20. h5Url.value = `http://192.168.110.147:8848/map/index.html?data=${cbfbm}&type=${type}&displayType=${dsType}`
  21. console.log('✅ 最终 H5 地址:', h5Url.value)
  22. }
  23. },
  24. { immediate: true }
  25. )
  26. // ==============================================
  27. // 接收 H5 数据,正确返回上一页(addLand.vue)
  28. const handleH5Message = (e) => {
  29. console.log('收到 H5 回传:', e.detail.data)
  30. e.detail.data.forEach(item => {
  31. // 假设你要回传的是地块数据
  32. if (item.type === 'drawLandFinished' || item.type === 'landSelected') {
  33. // 延迟一点点,让页面返回成功再赋值
  34. // setTimeout(() => {
  35. const pages = getCurrentPages()
  36. const prevPage = pages[pages.length - 2]
  37. if (prevPage) {
  38. prevPage.$vm.selectedLandData = item
  39. }
  40. // }, 100)
  41. }
  42. })
  43. }
  44. // ==============================================
  45. // 接收上个页面传过来的参数
  46. // ==============================================
  47. onLoad((options: any) => {
  48. console.log(11111111,JSON.parse(decodeURIComponent(options.memberInfo)))
  49. try {
  50. if (options.memberInfo) {
  51. getCbfbmjump.value = JSON.parse(decodeURIComponent(options.memberInfo))
  52. }
  53. if (options.type) {
  54. pageType.value = options.type
  55. }
  56. if (options.displayType) {
  57. dsType.value = options.displayType
  58. }
  59. console.log('✅ 解析参数:', getCbfbmjump.value, pageType.value,dsType.value)
  60. } catch (e) {
  61. console.log('参数解析失败', e)
  62. }
  63. })
  64. </script>