79 lines
1.9 KiB
Vue
79 lines
1.9 KiB
Vue
<template>
|
||
<view>
|
||
<web-view id="webview" :src="webviewUrl" @message="handleMessage"></web-view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, onMounted, onUnmounted } from "vue";
|
||
import { navigateToNewPage, saveImageToAlbum } from "./bridge.js";
|
||
|
||
const webviewUrl = ref("");
|
||
const originalWebviewUrl = ref("");
|
||
|
||
onUnmounted(() => {
|
||
uni.$off('UPLOAD_RESULT')
|
||
})
|
||
|
||
onMounted(() => {
|
||
// 获取页面参数
|
||
const pages = getCurrentPages();
|
||
const currentPage = pages[pages.length - 1];
|
||
const options = currentPage.options;
|
||
|
||
// 从页面参数中获取url
|
||
if (options.url) {
|
||
// 对URL进行解码，因为传递时可能被编码了
|
||
const decoded = decodeURIComponent(options.url);
|
||
webviewUrl.value = decoded;
|
||
originalWebviewUrl.value = decoded;
|
||
console.log("WebView URL:", decoded);
|
||
}
|
||
|
||
chooseAndUpload();
|
||
});
|
||
|
||
const chooseAndUpload = () => {
|
||
uni.$on('UPLOAD_RESULT', (imageUrl) => {
|
||
console.log('收到图片地址:', imageUrl)
|
||
const resultUrl = originalWebviewUrl.value + '&imageUrl=' + encodeURIComponent(imageUrl);
|
||
console.log('新的URL:', resultUrl)
|
||
webviewUrl.value = resultUrl;
|
||
})
|
||
}
|
||
|
||
const handleMessage = (event) => {
|
||
const messageData = event.detail.data[0];
|
||
console.log("Received message from H5:", messageData);
|
||
// 根据需要处理H5传递过来的消息
|
||
const action = messageData.action;
|
||
|
||
switch (action) {
|
||
case "navigateBack":
|
||
uni.navigateBack();
|
||
break;
|
||
case "navigateTo":
|
||
navigateToNewPage(messageData.url);
|
||
break;
|
||
case "showToast":
|
||
uni.showToast({ title: messageData.title, icon: messageData.icon || "none" });
|
||
break;
|
||
case "saveImage":
|
||
saveImageToAlbum(messageData.imageUrl);
|
||
break;
|
||
case "chooseAndUpload": {
|
||
uni.navigateTo({
|
||
url: '/pages-bridge/UploadImage',
|
||
})
|
||
}
|
||
break;
|
||
|
||
default:
|
||
console.log("Unknown action:", action);
|
||
}
|
||
};
|
||
|
||
</script>
|
||
|
||
<style lang="scss" scoped></style>
|