如何在具有一个信号的React Native中打开的通知上导航屏幕? [英] How to navigate screen on notification open in React Native with One Signal?

问题描述

这是我的代码，单击通知或通知中的按钮时，如何将用户导航到所需的屏幕.

Here is my code, how can I navigate user to the desired screen when clicked on a notification or button in a notification.

componentWillMount() {
    OneSignal.addEventListener('received', this.onReceived);
    OneSignal.addEventListener('opened', this.onOpened);
    OneSignal.addEventListener('registered', this.onRegistered);
    OneSignal.addEventListener('ids', this.onIds);

    OneSignal.inFocusDisplaying(2);
    OneSignal.requestPermissions({
        alert: true,
        badge: true,
        sound: true
    });
}

componentWillUnmount() {
    this.isUnmounted = true;

    OneSignal.removeEventListener('received', this.onReceived);
    OneSignal.removeEventListener('opened', this.onOpened);
    OneSignal.removeEventListener('registered', this.onRegistered);
    OneSignal.removeEventListener('ids', this.onIds);
}

onReceived(notification) {
    console.log("Notification received: ", notification);
}

onOpened(openResult) { // HERE I WANT TO NAVIGATE TO ANOTHER SCREEN INSTEAD OF HOME SCREEN
    this.isNotification = true;

    let data = openResult.notification.payload.additionalData;
    let inFocus = openResult.notification.isAppInFocus;

    console.log('Message: ', openResult.notification.payload.body);
    console.log('Data: ', openResult.notification.payload.additionalData);
    console.log('isActive: ', openResult.notification.isAppInFocus);
    console.log('openResult: ', openResult);
}

onRegistered(notifData) {
    console.log("Device had been registered for push notifications!", notifData);
}

onIds(device) {
    try {
        AsyncStorage.setItem("@SC:deviceInfo", JSON.stringify(device));
    } catch (error) {
        console.log(error);
    }
}

有人知道这一切吗，React Native + OneSignal + React Navigation + Redux.请帮忙！

Do anyone have knowledge about all this, React Native + OneSignal + React Navigation + Redux. Please help!

推荐答案

要实现所需的行为，您可以做几件事.您可以手动检查路由器的通知和状态，并在必要时将用户重定向到屏幕，也可以使用

To achieve the desired behavior you can do couple of things. You can manually check the notification and state of the router and if its necessary redirect the user to the screen or you can use the Deep Linking functionality.

要使用深度链接，请在发送时在通知中附加 url 参数它.要将用户定向到您应用中的正确屏幕，您可以使用反应导航深层链接功能.

To use Deep Linking you attach url parameter to your notification while sending it. To direct user to the correct screen in your app you can use react-navigation deep linking functionality.

来自一个信号文档

url字符串用户单击浏览器时在浏览器中打开的URL. 通知.示例: http://www.google.com

url string The URL to open in the browser when a user clicks on the notification. Example: http://www.google.com

注意:iOS需要在plist中使用https或更新的NSAppTransportSecurity

Note: iOS needs https or updated NSAppTransportSecurity in plist

---

来自React Navigation文档

深层链接

在本指南中，我们将设置我们的应用程序以处理外部URI.让我们从我们在中创建的SimpleApp开始 入门指南.在此示例中，我们想要一个类似 mychat://chat/Taylor打开我们的应用程序并直接链接到Taylor的 聊天页面.

In this guide we will set up our app to handle external URIs. Let's start with the SimpleApp that we created in the getting started guide. In this example, we want a URI like mychat://chat/Taylor to open our app and link straight into Taylor's chat page.

这篇关于如何在具有一个信号的React Native中打开的通知上导航屏幕?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！