现象描述:
从一个快应用A 跳转到B 快应用的B1 页面, A 可能是一个快应用,也可能是负一屏的卡片,如何区分来自哪个呢?
快应用和卡片都是通过router.push 接口来跳转其他快应用的,使用Deeplink 中的hap 链接来实现的,同时hap 链接里是可以携带参数,在跳过去时加个flag 参数,在B 快应用的B1 页面获取参数,根据参数值判断来源是负一屏的卡片还是快应用A ,然后根据需要做相应的逻辑处理。快应用使用this.xx 获取跳转携带的参数。
A快应用代码:
<template>
<div>
<text class="button" onclick="router">测试</text>
</div>
</template>
<style>
.button{
width: 100%;
height: 200px;
color: #000000;
font-size: 80px;
}
</style>
<script>
import router from '@system.router';
module.exports = {
data: {
},
onInit() {
this.$page.setTitleBar({ text: '' })
},
router(){
console.log("router");
router.push({
uri: 'hap://app/com.huawei.ceshi/Test?body=quickapp',//快应用参数
})
}
}
</script>
卡片相关代码:
<template>
<div>
<text class="button" onclick="router">测试</text>
</div>
</template>
<style>
.button{
width: 100%;
height: 200px;
color: #000000;
font-size: 80px;
}
</style>
<script>
import router from '@system.router';
module.exports = {
data: {
},
onInit() {
this.$page.setTitleBar({ text: '' })
},
router(){
console.log("router");
router.push({
uri: 'hap://app/com.huawei.ceshi/Test?body=card',//卡片参数
})
}
}
</script>
B 快应用代码:
在onInit() 生命周期方法中获取参数值,如下代码中定义了accept 变量接收参数值,比如在onBackPress() 方法中根据来源实现不同的业务逻辑。
<template>
<div style="flex-direction: column;">
<text class="text">下面是接收的数据</text>
<text class="text" style="background-color: black">{{accept}}</text>
</div>
</template>
<style>
.text {
height: 80px;
font-size: 50px;
color: red;
width: 500px;
}
</style>
<script>
import router from '@system.router';
module.exports = {
data: {
accept: ""
},
onInit() {
this.$page.setTitleBar({ text: '' })
this.accept = this.body;
},
onBackPress() {
if (this.accept === "quickapp") {
console.log("this is quickapp");
} else if (this.accept === "quickapp") {
console.log("this is crad");
}else{
router.back()
}
return true;
}
}
</script>
欲了解更多详情,请参阅:
快应用开发指导文档: https://developer.huawei.com/consumer/cn/doc/development/quickApp-Guides/quickapp-whitepaper
快应用路由接口介绍: https://developer.huawei.com/consumer/cn/doc/development/quickApp-References/quickapp-api-router
原文链接: https://developer.huawei.com/consumer/cn/forum/topic/0204422879753860623?fid=18
原作者:Mayism
来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/69970551/viewspace-2769298/ ,如需转载,请注明出处,否则将追究法律责任。