區分router.push跳轉快應用的來源渠道的方法教程

本篇內容主要講解“區分router.push跳轉快應用的來源渠道的方法教程”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“區分router.push跳轉快應用的來源渠道的方法教程”吧!

現象描述：

從一個快應用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 >
        <text class="text">下面是接收的數據</text>
        <text class="text" >{{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>

到此，相信大家對“區分router.push跳轉快應用的來源渠道的方法教程”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！