景象形容:
从一个快利用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/...
快利用路由接口介绍:https://developer.huawei.com/...
原文链接:https://developer.huawei.com/...
原作者:Mayism