React Native component not mounting

Question

I'm currently working on a react-native application where we're using a React "component" (it doesn't display anything, just acts as a dispatcher) to complete some one-off requests in JavaScript. The JS code is very simple:

import React from 'react'
import { AppRegistry, DeviceEventEmitter } from 'react-native'

class NativeEventDispatcher extends React.Component {
  constructor() {
    super()
    console.log("anyone home?")
  }
  componentDidMount() {
    DeviceEventEmitter.addListener('DoSomething', () => {})
  }
  render() {
    return null
  }
}

AppRegistry.registerComponent('NativeEventDispatcher', () => NativeEventDispatcher);

For some reason however, after calling

val rootView = ReactRootView(context)
rootView.startReactApplication(reactInstanceManager, "NativeEventDispatcher", null)
addContentView(rootView, ViewGroup.LayoutParams(0, 0))
reactInstanceManager.onHostResume(this, this)

nothing happens. The component doesn't mount, no breakpoints in the JS file get executed, the log in the constructor never prints. Almost as though the component mount is failing silently.

Has anyone encountered this before? Any potential solutions? Been trying to debug this for a day or so now with no luck.

Answer 1

I don't know about second stuff but I would write first one like this.

import React, { Component } from 'react';
import { View, AppRegistry, DeviceEventEmitter } from 'react-native';

class NativeEventDispatcher extends Component {
    constructor(props) {
        super(props)
        console.log("anyone home?")
    }
    componentDidMount() {
        DeviceEventEmitter.addListener('DoSomething', () => {})
    }
    render() {
        return (
            <View></View>
        );
    }
}

export default NativeEventDispatcher;

AppRegistry.registerComponent('NativeEventDispatcher', () => NativeEventDispatcher);

You should export your class with export default