Тип элемента недействителен: ожидается, что строка (для встроенных компонентов) или ошибка класса/функции (для компонентJavascript

Форум по Javascript
Ответить
Anonymous
 Тип элемента недействителен: ожидается, что строка (для встроенных компонентов) или ошибка класса/функции (для компонент

Сообщение Anonymous »

Я работаю над нативным проектом React, используя навигацию и flat -лист, но я получаю следующую ошибку, когда запускаю приложение: < /p>
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.
< /code>
Я понимаю, что эта ошибка обычно возникает, когда компоненты не экспортируются должным образом или существует микширование между по умолчанию и названным импортом. Тем не менее, я дважды проверил свой код и позаботился о том, чтобы все компоненты экспортировались с использованием экспорта по умолчанию. Ниже приведена структура моего проекта: < /p>
App.js
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import HomeScreen from './src/Screens/HomeScreen/HomeScreen';
import CoursesScreen from './src/Screens/Courses/CoursesScreen';

const Stack = createNativeStackNavigator();

export default function App() {
return (






);
}
< /code>
homescreen.js
import { StyleSheet, Text, View } from 'react-native';
import React from 'react';

export default function HomeScreen() {
return (

HomeScreen

);
}

const styles = StyleSheet.create({});

< /code>
coursescreen.js
import { StyleSheet, Text, FlatList } from 'react-native';
import React from 'react';

export default function CoursesScreen() {
const Person = [
{ id: 1, name: 'Horace', age: 10 },
{ id: 2, name: 'Amos', age: 20 },
{ id: 3, name: 'Peter', age: 30 },
{ id: 4, name: 'John', age: 40 },
];

return (
item.id.toString()}
renderItem={({ item }) => (

{item.id}.{item.name}

)}
/>
);
}

const styles = StyleSheet.create({
content: {
fontSize: 20,
backgroundColor: 'yellow',
padding: 20,
marginVertical: 10,
},
});

< /code>
Ошибка, которую я получаю:
Когда я запускаю вышеуказанный код, я получаю следующую ошибку: < /p>
Error I’m Getting:
When I run the above code, I get the following error:
< /code>
То, что я пробовал до сих пор: < /p>

Проверьте, что все компоненты экспортируются с экспортом по умолчанию. < /li >
подтвердил, что пути файла в импорте верны.
npx react-native start --reset-cache
keyExtractor={(item) => item.id.toString()}
npm install @react-navigation/native
npm install react-native-screens react-native-safe-area-context react-native-gesture-handler react-native-reanimated react-native-vector-icons
npm install @react-navigation/native-stack

< /code>
Проблема все еще существует!
Может ли что -то мне не хватает? Я буду признателен за любую помощь или руководство по решению этой проблемы. Спасибо! 😊

Подробнее здесь: https://stackoverflow.com/questions/794 ... or-a-class
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»