TypeError对象不是构造函数（正在评估new_pubnubReact.default'）

Question

我是新来的响应本机的人，正在尝试为Android创建推送通知。

我正在使用PubNub的以下教程。

PubNub tutorial

完成本教程后，当我在android studio模拟器中运行我的应用程序时，出现以下错误。

不太确定如何解决它，就像我在Google上搜索时一样，问题什么都没有出现。

这是我的代码

import React from 'react';
    import PushNotificationIOS from 'react-native';
    import PubNubReact from 'pubnub-react';

    const PushNotification = require('react-native-push-notification');

    export default class App extends React.Component {
    constructor(props) {
    super(props);
    this.pubnub = new PubNubReact({
        publishKey: 'YOUR_PUBNUB_PUBLISH_KEY_HERE',
        subscribeKey: 'YOUR_PUBNUB_SUBSCRIBE_KEY_HERE'
    });
    this.pubnub.init(this);
    PushNotification.configure({
      // Called when Token is generated.
      onRegister: function(token) {
          console.log( 'TOKEN:', token );
          if (token.os == "ios") {
            this.pubnub.push.addChannels(
            {
              channels: ['notifications'],
              device: token.token,
              pushGateway: 'apns'
            });
            // Send iOS Notification from debug console: {"pn_apns":{"aps":{"alert":"Hello World."}}}
          } else if (token.os == "android"){
            this.pubnub.push.addChannels(
            {
              channels: ['notifications'],
              device: token.token,
              pushGateway: 'gcm' // apns, gcm, mpns
            });
            // Send Android Notification from debug console: {"pn_gcm":{"data":{"message":"Hello World."}}}
          }  
      }.bind(this),
      // Something not working?
      // See: https://support.pubnub.com/support/solutions/articles/14000043605-how-can-i-troubleshoot-my-push-notification-issues-
      // Called when a remote or local notification is opened or received.
      onNotification: function(notification) {
        console.log( 'NOTIFICATION:', notification );
        // Do something with the notification.
        // Required on iOS only (see fetchCompletionHandler docs: https://reactnative.dev/docs/pushnotificationios)
        // notification.finish(PushNotificationIOS.FetchResult.NoData);
      },
      // ANDROID: GCM or FCM Sender ID
      senderID: "sender-id",
  });
}
    }

Answer 1

pubnub-react库在版本2.0.0中已完全更改。默认情况下，它不再包含pubnub JavaScript SDK，因此您也必须安装它。

Here is the link到新的PubNub React存储库，并在README.md文件中找到有关如何使用它的示例。

---

如果您想使用与您正在阅读的教程/博客文章兼容的旧版本，请按照以下方式安装PubNub React SDK的旧版本：

$ npm install pubnub-react@1

---

要总结更改，pubnub-react现在使用Context和Hooks API将PubNub实例传播到子树的深处。

提供商

您需要将提供程序包括在组件树的顶部。

import React from 'react'
import PubNub from 'pubnub'
import { PubNubProvider } from 'pubnub-react'

const pubnub = new PubNub({}) // PubNub configuration

export const App = () => {
    return <PubNubProvider client={pubnub}>
        <Child />
    </PubNubProvider>
}

消费者

要在其他地方使用PubNub实例，现在只需使用usePubNub钩子即可。

import { usePubNub } from 'pubnub-react'

export const Child = () => {
    const pubnub = usePubNub()
    
    return <div>I am using PubNub!</div>
}