<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> <title></title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <style> .btn{ display: block; margin: 10px auto; width: 40%; height: 45px; line-height: 45px; text-align: center; border-radius: 10px; background-color: #259F3B; color: #FFFFFF; border: none; } </style> </head> <body> <div id="app"> <div> <div> 这里是小程序来的数据：{{wxdata}} </div> <button class="btn" @click="postWx">向页面发送数据1</button> <button class="btn" @click="postWx2">向页面发送数据2</button> </div> </div> <!-- 微信的SDK --> <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script> <!-- uni 的 SDK --> <script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script> <script> var app = new Vue({ el: '#app', data: { wxdata: "abc" }, mounted() { this.$nextTick(() => { document.addEventListener('UniAppJSBridgeReady', function() { uni.getEnv(function(res) { console.log('当前环境：' + JSON.stringify(res)); }); }); }) }, created() { this.wxdata = this.getQueryString('wxdata') || 'abc' console.log(this.wxdata) }, methods: { postWx() { uni.switchTab({ url: '/pages/my/my' }); uni.postMessage({ data: { action2: '我是按钮2', action1: '我是按钮1' } }); }, postWx2() { uni.switchTab({ url: '/pages/my/my' }); uni.postMessage({ data: { action2: '我是按钮2', action1: '我是按钮1' } }); }, getQueryString: function(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r = window.location.search.substr(1).match(reg); if (r != null) { return decodeURIComponent(r[2]); } return null; } } }) </script> </body> </html>