hbuilder开发的app,uniapp与html，vue2开发项目相互传值通讯的方法

首先在uniapp中

<web-view @load="onWebviewLoad" :src="webViewSrc"></web-view>

调用你的web地址，初始化时候需要调用传递方法，以下是全部代码

<template>
	<view class="content">
		<!-- 		<web-view @message="messageData" @load="onWebviewLoad" 
		:src="webViewSrc"></web-view> -->
		<web-view @load="onWebviewLoad" :src="webViewSrc"></web-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				webViewSrc: 'http://192.168.245.20:6060'
			}
		},
		onLoad() {
			
		},
		mounted() {
			let currentWebview = this.$scope.$getAppWebview();
			let wv = currentWebview.children()[0];
			let data = {
				text: 'uniapp传参给vue'
			}
			wv.evalJS(`getVueMessage(${JSON.stringify(data)})`);
		},
		methods: {

			onWebviewLoad() {
				let currentWebview = this.$scope.$getAppWebview();
				let wv = currentWebview.children()[0];
				let data = {
					text: 'uniapp传参给vue'
				}
				wv.evalJS(`getVueMessage(${JSON.stringify(data)})`);
			},

			// 监听的参数
			messageData(e) {
				console.log(JSON.stringify(e.detail)) // 接收的参数
			},

		}
	}
</script>

<style>

</style>

vue2 代码，需要先引入一个文件，也可以下载下来

在Public/index.html 中引用

<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.1.js"></script>

要注意这里的引用顺序 以下是全部vue2的代码

<template>
  <div class="index">
    <button @click="clickVal">点击传参</button>
    <p>{{ text }}</p>
  </div>
</template>

<script>

export default {
  data() {
    return {
      text: ''
    }
  },
  mounted() {
    this.$nextTick(() => {
      window.getVueMessage = (data) => {
        this.text = data.text
      }
    })
  },
  methods: {
    /**
     * 给app传参
     */
    clickVal() {
      uni.postMessage({
        data: {
          text: '我传参怎么了，我传参怎么了，我传参怎么了。11',
        }
      })
    }
  }
}
</script>
<style scoped lang="less"></style>