H5代码
<view class="success-pay bgCover">
<view class="success-pay-content">
<view class="success-pay-content-pay">
<image src="/static/success-pay.png" class="success-pay-content-pay-image" />
<view class="success-pay-content-pay-text">付款成功</view>
</view>
<view class="success-pay-content-btn">
<view class="bottom-text" @click="sendMessage">返回app</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
sendMessage() {
console.log("------!!")
//发出支付成功通知
uni.webView.postMessage({
data: {
action: 'message'
}
})
}
},
}
</script>
uniapp 端代码
<template>
<view class="bgCover">
<Header title="支付" />
<view class="main">
<web-view @message="getMessage" @onPostMessage="getMessage" :src="src" fullscreen="false"
:webview-styles="webviewStyles"></web-view>
</view>
</view>
</template>
<script setup lang="ts">
import { onMounted, reactive, ref, computed } from "vue";
import { onLoad, onShow } from "@dcloudio/uni-app";
import Header from '../../v2/components/header/index.vue'
import { depositFeeOrderInfo } from './api/index'
import { useThemeStore } from '@/store/theme'
import { APP_USER_KIND, APP_STUDENT_USER_ID } from '@/config/constants'
import storage from '@/utils/storage'
const src = ref();
const webviewStyles = ref({
width: '100%',
height: '90%',
top: '100px',
bottom: '56px',
zIndex: 0
});
const depositFee = ref()
const theme = useThemeStore()
const statusBar = ref('')
onLoad(async (options) => {
})
const depositFeeOrderInfos = async (type: any, vipPrice: any) => {
}
onShow(() => {
});
const getMessage = (res) => {
console.log('接收到消息')
console.log('接收到消息', JSON.stringify(res.detail.data))
if (res.detail.data[0].action == 'message') {
uni.navigateTo({ url: '/v2/home/index' });
}
};
onMounted(async () => {
statusBar.value = theme.topBarHeight
})
</script>