uniapp 使用webview时 获取h5的数据响应

当uniapp中使用webview展示一个h5页面，例如，展示一个表单页面，希望h5表单提交完成后，uniapp当前放置webview的页面返回上一页，这时，需要获取到来自h5的响应信息

uniapp中

@message：网页向应用 postMessage 时，会在特定时机（后退、组件销毁、分享）触发并收到消息。

<web-view :src="vdata.url" @message="onMessageFunc"></web-view>

// 网页向小程序 postMessage 为实时消息
// 接收到 web-view事件 
function onMessageFunc(msg) {
	console.log(msg);
  // 接收到响应的数据 [数组格式， 比如接收到 web-view的返回等特定事件， 将数据入栈全部返回 ]
  let postDataArray = msg.detail.data

  // 无数据
  if (!postDataArray || !Array.isArray(postDataArray)) {
    return false
  }
}

h5页面

// 挂载钩子函数
onMounted(() => {
  // 判断为微信环境 加载微信jssdk
  if(isWeiXinBrowser()){
      const script = document.createElement('script')
      script.src = 'https://res.wx.qq.com/open/js/jweixin-1.3.2.js'
      script.type = 'text/javascript'
      document.head.appendChild(script)
  }
})

// 判断是否为微信环境
function isWeiXinBrowser() {
  var ua = navigator.userAgent.toLowerCase()
  var isWeixin = ua.indexOf('micromessenger') != -1
  if (isWeixin) {
      return true
  } else {
      return false
  }
}

// 需要返回响应数据的方法
function saveData (msg) {
  if((window as any).uni){
    (window as any).uni.postMessage({
    	// 注意：放置数据， 必须在data字段下，  比如： uni.postMessage({data: {ctrl: 'TOTOTOTOTOT'}})
    	data: {ctrl: 'xxxx'}
   	})
    if(isWeiXinBrowser()){ //判断为微信环境 调用小程序回退页面方法 因为小程序 回退会立即关闭页面 所以用 timeout 延迟执行
        const timeOut = setTimeout(()=>{
            (window as any).wx.miniProgram.navigateBack({ delta: 1 })
        },500)
    }
    console.log('postMessage 推送完成')
  }
}