导入组件,元素类型无效:预期为字符串

时间:2020-06-11 09:58:44

标签: reactjs react-native

我正在尝试导入Search组件,但始终收到上述错误:

import {Search} from '../components/Search';
import {filteredVideo, initSearch} from '../actions/videos';
import StyledText from '../components/StyledText';
const DrawerHeader = props => {
  const {
    navigation,
    route: {name},
  } = props;

  return (
    <>
      <View style={styles.container}>
        ....
      <Search {...props} />
    </>
  );
};

export default DrawerHeader;

搜索:

const Search = props => {
  const {
    navigation: {navigate},
    route: {name},
    value,
  } = props;

  ....

  const renderItem = ({item}) => {
    return (
      <Text onPress={() => onPress(item)} style={style.itemStyle}>
        {item.title}
      </Text>
    );
  };
  return (
    <View>
        {name == 'Home' || name == 'Video Episodes' ? (
        <SearchBar
          round
          containerStyle={styles.containerStyle}
          inputStyle={{backgroundColor: 'white'}}
          inputContainerStyle={{
            borderRadius: 5,
            backgroundColor: 'white',
          }}
          icon={iconStyle}
          onSubmitEditing={onSubmitEdit}
          searchIcon={{size: 18}}
          onChangeText={text => SearchFilterFunction(text)}
          onClear={text => SearchFilterFunction('')}
          placeholder="Type Here..."
          value="hello"
        />
      ) : null}
      {name == 'Home' ? (
        <View>
          <FlatList
            data={search.videos}
            renderItem={renderItem}
            contentContainerStyle={{overflow: 'hidden'}}
            keyExtractor={item => item.id.toString()}
            ItemSeparatorComponent={separator}
          />
        </View>
      ) : null}
    </View>
  );
};

export default Search;

有什么想法吗?

错误:

未处理的JS异常:错误:元素类型无效:预期为字符串(对于内置组件)或类/函数(对于复合组件),但得到:未定义。您可能忘记了从定义文件中导出组件,或者您可能混淆了默认导入和命名导入。

2 个答案:

答案 0 :(得分:0)

import Search from '../components/Search'; 

export { Search }

答案 1 :(得分:0)

您具有默认导出 所以改变这个

import {Search} from '../components/Search';

import Search from '../components/Search';