元素类型无效:应为字符串(对于内置组件)或类/函数(对于复合组件),但得到:您可能忘记了从定义组件的文件中导出组件,或者您可能混淆了默认导入和命名导入。
主屏幕代码
import {
View,
Text,
SafeAreaView,
Image,
TextInput,
ScrollView,
} from "react-native";
import React, { useLayoutEffect } from "react";
import { useNavigation } from "@react-navigation/native";
import {
UserIcon,
ChevronDownIcon,
SearchIcon,
AdjustmentsIcon,
} from "react-native-heroicons/outline";
import Categories from "../components/Categories";
const HomeScreen = () => {
const navigation = useNavigation();
useLayoutEffect(() => {
navigation.setOptions({
headerShown: false,
});
}, []);
return (
<SafeAreaView className="bg-white pt-5 flex-col">
{/* Header */}
<View className="flex-row pb-3 items-center mx-4 space-x-2 px-4">
<Image
source={{
url: "https://links.papareact.com/wru",
}}
className="h-7 w-7 bg-gray-300 p-4 rounded-full"
/>
<View className="flex-1">
<Text className="font-bold text-gray-400 text-xs">Deliver Now !</Text>
<Text className="font-bold text-xl">
Current Location
<ChevronDownIcon size={20} color="#00cc88" />
</Text>
</View>
<UserIcon size={35} color="#00cc88" />
</View>
{/* Search */}
<View className="flex-row items-center space-x-2 pb-2 mx-4 ">
<View className="flex-row flex-1 space-x-2 bg-gray-200 p-3">
<SearchIcon color="gray" size={20} />
<TextInput
placeholder="Restros and Cuisines"
keyboardType="default"
/>
</View>
<AdjustmentsIcon color="#00cc88" />
</View>
{/* Body */}
<ScrollView
className="bg-gray-100"
contentContainerStyle={{
paddingBottom: 100,
}}
>
{/* Categories */}
<Categories />
{/* Featured Rows */}
</ScrollView>
</SafeAreaView>
);
};
export default HomeScreen;
我不知道我特别输入或输出错误。请帮助我
import { View, Text } from 'react-native'
import React from 'react'
const Categories = () => {`enter code here`
return (
<View>
<Text>Categories</Text>
</View>
)
}
export default Categories
2条答案
按热度按时间fzwojiic1#
我在图标上花了很大的力气,但出现了一个错误:预期字符串...导出/导入出错...等。您必须在heroicons网站上搜索名称,因为它们不同:搜索图标=放大玻璃图标调整图标=调整垂直图标
jobtbby32#
好吧,我是怎么解决这个问题的,用AdjustmentsVerticalIcon替换AdjustmentsIcon,你的bug应该被修复了。改变这个的原因是,如果你在HeroIcons网站上搜索图标,你输入AdjustmentsIcon,没有图标被过滤掉。他们显然把它改成了AdjustmentsVerticalIcon。