React-native-paper: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

Created on 18 Oct 2018 · 5Comments · Source: callstack/react-native-paper

Current behaviour

As a result of wrapping my component with PaperProvider I've got the following error:

Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

Check the render method of Portal.Host.

This error is located at:
in Portal.Host (at Provider.js:16)
in Provider (at MyCallsWrapper.js:7)
in MyCallsWrapper (at renderApplication.js:35)
in RCTView (at View.js:71)
in View (at AppContainer.js:102)
in RCTView (at View.js:71)
in View (at AppContainer.js:122)
in AppContainer (at renderApplication.js:34)

Code sample

MyCallsWrapper.js

import * as React from 'react';
import MyCallsScreen from "./MyCalls";
import {Provider as PaperProvider} from 'react-native-paper';

export default function MyCallsWrapper(props) {
    return (
        <PaperProvider>
            <MyCallsScreen userTags={props.userTags} phone_id={props.phone_id}/>
        </PaperProvider>
    )
}

MyCallsScreen.js

import React from "react";
import PropTypes from 'prop-types';

import {
    StyleSheet,
    View,
    InteractionManager
} from 'react-native';

export default class MyCallsScreen extends React.Component {
    // some logic
    render() {
        return (
            <View style={styles.container}>
                // some content
            </View>
        )
    }
}

inside index.js

AppRegistry.registerComponent('MyCalls', () => MyCallsWrapper);

Your Environment

| software | version
| --------------------- | -------
| ios or android | android
| react-native | 0.53.0
| react-native-paper | 2.1.3
| node | 10.8.0
| npm or yarn | 6.4.1

Source