Question

以下是我的代码，如何在点击通知中的通知或按钮时将用户导航到所需的屏幕。

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。请帮忙！

Answer 1

为了达到理想的行为，你可以做几件事。您可以手动检查路由器的通知和状态，如果需要将用户重定向到屏幕，或者您可以使用Deep Linking功能。

要使用深层链接，请在发送时将url参数附加到您的通知中。要将用户定向到应用中的正确屏幕，您可以使用react-navigation deep linking功能。

来自One Signal Documentation

url string用户点击时在浏览器中打开的URL   通知。示例：http://www.google.com

注意：iOS需要https或更新plist中的NSAppTransportSecurity

来自React Navigation Documentation

深层链接

在本指南中，我们将设置我们的应用程序来处理外部URI。让我们从我们在中创建的SimpleApp开始   getting started guide。在这个例子中，我们想要一个像URI的   mychat://chat/Taylor打开我们的应用并直接链接到Taylor的   聊天页面。

Answer 2

您可以在NavigationAction被解雇时发送navigate或执行onOpened操作。以下代码段应该有效：

componentWillMount() {
    OneSignal.inFocusDisplaying(0);
    OneSignal.removeEventListener('opened', this.onOpened.bind(this));
    OneSignal.addEventListener('opened', this.onOpened.bind(this));
  }

onOpened(openResult) {
    let data = openResult.notification.payload.additionalData;
    // ScreenName is the name of the screen you defined in StackNavigator
    this.props.navigation.navigate('ScreenName', data)
}

Answer 3

万一其他人遇到类似的问题，我想补充一下@Mostafiz Rahman所说的内容。我正在使用的应用程序在抽屉中有一堆嵌套的堆栈和选项卡（react-navigation v1），如果Stack1是后台的并且通知是针对Stack2的，则无法让他们跳来跳去。

我最终将Rahman先生描述的逻辑放在堆栈的每个第一屏幕中，例如Stack1的第一个屏幕，Stack2的第一个屏幕，等等。它！

如何在React Native with One Signal中打开通知屏幕？

3 个答案: