使用 react-native 创建本地推送通知

Posted

技术标签:

【中文标题】使用 react-native 创建本地推送通知【英文标题】:creating local push notification using react-native 【发布时间】:2017-03-30 12:53:14 【问题描述】:

我正在使用 react-native 开发 android 应用程序。我想通过单击按钮创建本地推送通知。我怎样才能做到这一点?我需要导入哪些库? prasanna

【问题讨论】:

How to create local push notification using react-native-push-notification的可能重复 可能重复***.com/questions/43041667/… 【参考方案1】:
import PushNotification from 'react-native-push-notification';

scheduleNotfication()  
 PushNotification.localNotificationSchedule( 
 message: "My Notification Message", // message 
 date: new Date(Date.now() + (60 * 1000)) // your required time 
 ); 
 

在按钮内部调用 scheduleNotfication() 方法

【讨论】:

【参考方案2】:

您可以使用react-native-fcm插件进行本地通知和预定通知。

代码sn-p

_onLocalNotification()
    if(Platform.OS  === "android")
        FCM.presentLocalNotification(
            id: "UNIQ_ID_STRING",                               // (optional for instant notification)
            title: this.state.content,                     // as FCM payload
            body: this.state.content,                    // as FCM payload (required)
            sound: "default",                                   // as FCM payload
            priority: "high",                                   // as FCM payload
            click_action: "ACTION",                             // as FCM payload
            badge: 10,                                          // as FCM payload ios only, set 0 to clear badges
            number: 10,                                         // Android only
            ticker: "My Notification Ticker",                   // Android only
            auto_cancel: true,                                  // Android only (default true)
            large_icon: "ic_launcher",                           // Android only
            icon: "ic_launcher",                                // as FCM payload, you can relace this with custom icon you put in mipmap
            big_text: "Show when notification is expanded",     // Android only
            sub_text: "This is a subText",                      // Android only
            color: "red",                                       // Android only
            vibrate: 300,                                       // Android only default: 300, no vibration if you pass null
            tag: 'some_tag',                                    // Android only
            group: "group",                                     // Android only
            my_custom_data:'my_custom_field_value',             // extra data you want to throw
            lights: true,                                       // Android only, LED blinking (default false)
            show_in_foreground: true                                  // notification when app is in foreground (local & remote)
        );
    
   else
        FCM.scheduleLocalNotification(
            fire_date: new Date().getTime() + 1000,      //RN's converter is used, accept epoch time and whatever that converter supports
            id: '1111',
            body: this.state.content,
            repeat_interval: 'day',
            count: 3,
            show_in_foreground: true
        )
    



_onScheduledNotification()
    FCM.scheduleLocalNotification(
        fire_date: new Date().getTime() + 5000,      //RN's converter is used, accept epoch time and whatever that converter supports
        id: '1111',
        body: this.state.content,
        repeat_interval: 'day',
        count: 3,
        show_in_foreground: true
    )

如果您遇到任何问题,请检查并告诉我。 注意 - 问题评论中提供的解决方案使用 react-native-push-notification 插件。

【讨论】:

为此需要导入哪些库? FCM需要导入吗? 运行命令npm install react-native-fcmreact-native-link react-native-fcm

以上是关于使用 react-native 创建本地推送通知的主要内容,如果未能解决你的问题,请参考以下文章

在 react-native 中使用 aws pinpoint 推送通知

如何使本地 APNS 推送通知静音?

无法在 react-native 中获取 iOS 推送通知设备令牌

将下载的声音用于推送通知(react-native)

Expo react-native 裸工作流使用推送通知

如何在 react-native App 上获取推送通知?