createStackNavigation 不变违规元素类型无效预期字符串 [英] createStackNavigation invariant violation element type is invalid expected a string

问题描述

Upon creating importing and using createStackNavigation I'm getting the following error. Any help would be greatly appreciated! Also, this is my first app in react-native so please be patient with me.

I've tried other versions of StackNavigation read other posts relating to the error but none of them seem to get me anywhere.

import React, { Component } from "react";
import { Center } from "@builderx/utils";
import { View, StyleSheet, Image, Text } from "react-native";
import { createAppContainer } from 'react-navigation';
import { MainNavigation } from '../screens/MainNavigator';


const AppContainer = createAppContainer(MainNavigation);

export default class DlLoading_2 extends Component {
  render() {
    return (
      <View style={styles.root}>
        <Center />
        <AppContainer
          TouchableHighlight onPress={() => 
this.navigation.navigate('DlMain')}>
          Image style={styles.blueDisk} source= . 
  {require('../assets/ComponentTMP_0-image.jpg')} />
        </AppContainer>

        <Center horizontal>
          <Image
            source={require("../assets/ComponentTMP_0-image2.png")}
            style={styles.dlLogo}
          />
        </Center>
        <Center horizontal>
          <Text style={styles.text}>TRANSINDENTAL MEDITATION</Text>
        </Center>
      </View>
    );
  }
}
const styles = StyleSheet.create({
  root: {
    backgroundColor: "#FFFFFF",
    flex: 1
  },
  blueDisk: {
    height: 401.5,
    width: 602,
    position: "absolute"
  },
  dlLogo: {
    height: 97,
    width: 300,
    position: "absolute",
    top: "6.61%"
  },
  text: {
    height: 53,
    width: 301,
    top: 660,

    position: "absolute",
    backgroundColor: "transparent",
    lineHeight: 24,
    letterSpacing: 0,
    fontFamily: "Gotham-Book",
    fontSize: 24,
    textAlign: "center",
    color: "rgba(92,92,95,1)"
  }
});

Here is my MainNavigator.js too:

import DlLoading_2 from "./src/screens/DlLoading_2";
import DlMain from "./src/screens/DlMain";
import { createStackNavigator, createAppContainer } from "react- 
navigation";
import { create } from "handlebars";

const MainNavigator = createStackNavigator({
    DlLoading_2: {
      screen: DlLoading_2
    },
    DlMain: {
      screen: DlMain
    }
  },
  {
    headerMode: "none"
  }
  );

  export default createAppContainer(MainNavigator);

解决方案

Its the problem with 'export default' and import with {} or without {}.

Change this line

import { MainNavigation } from '../screens/MainNavigator';

to (remove the curly brackets)

import  MainNavigation  from '../screens/MainNavigator';

这篇关于createStackNavigation 不变违规元素类型无效预期字符串的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！