CODEWITHSUNDEEP
react-nativeexpo
wafa.A
wafa.A

Reputation: 101

React native export issue

i have build an ReactNative application with Expo i want render function component inside class component and face issue with export while i very sure i did include export the component

the error show :

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of Register

the component i want to render

DateModal.js




import React from 'react';
import {
  View,
  StyleSheet,
  TouchableOpacity,
  ScrollView,
} from 'react-native';
import i18n from 'i18n-js';
import DatePicker from '../../utils/calendar/containers/datepicker/datepicker';
import { Text, TextInput } from '../core';

export default function DateModal(){
  
    return(
        <View>
            <Text>waffffa</Text>
        </View>
    )
}

Upvotes: -1

Views: 522

Answers (1)

Mishimaster
Mishimaster

Reputation: 194

I don't know if it will resolve your problem but you can try to export default after the function , and also try to import Text and TextInput from react-native


import React from 'react';
import {
  View,
  StyleSheet,
  TouchableOpacity,
  ScrollView, Text, TextInput
} from 'react-native';

function DateModal(){
    return(
        <View>
            <Text>waffffa</Text>
            <TextInput
        style={styles.input}
        value={12}
        placeholder="useless placeholder"
        keyboardType="numeric"
      />
        </View>
        
    )
}

const styles = StyleSheet.create({
    input: {
      height: 40,
      margin: 12,
      borderWidth: 1,
      padding: 10,
    },
  });

export default DateModal;

And in your main js

import { StyleSheet, Text, View } from 'react-native';
import DateModal from './components/DateModal';

export default function App() {
  return (
    <View style={styles.container}>
      <DateModal />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Hope this will help you

Upvotes: 1

Related Questions