警告:React.createElent:type无效&警告:道具类型失败:提供给“叠加层”的数组类型的道具“子级”无效

时间:2020-06-11 21:19:02

标签: react-native overlay react-native-elements

在以下代码中获得2条警告。

警告:React.createElent:type无效-预期为字符串(对于内置组件)或类/函数(对于复合组件),但为“未定义”。

警告:道具类型失败:提供给“叠加层”的数组类型无效的道具“子级”,应使用单个ReactElement。

import React, {useState} from 'react';
import {Button, Overlay} from 'react-native-elements';
import {View, Text, ImageBackground, StyleSheet} from 'react-native';
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import {LinearGradient} from 'expo-linear-gradient';

const Tab1 = ({navigation}) => {
  const [visible, setVisible] = useState(false);

  const toggleOverlay = () => {
    setVisible(!visible);
  };
  return (
    <View style={styles.container}>
      <Text>Tab1</Text>
      <Button title="Open Details " onPress={toggleOverlay} />
      <Overlay isVisible={visible} fullScreen={true}>
        <View>
          <ImageBackground
            source={{
              uri:
                'https://cdn.tasteatlas.com/images/dishes/b44b470fae3648d0bffd06aa9e7b782c.jpg',
            }}
            style={styles.imagebg}>
            <LinearGradient
              colors={['rgba(0,0,0,0.0)', '#fff']}
              style={styles.headerovr}
            />
            <View style={styles.backbtn}>
              <Button
                icon={<Icon name="arrow-left" size={25} color="white" />}
                type="clear"
                onPress={toggleOverlay}
              />
            </View>
          </ImageBackground>
          <Text style={styles.modalheader}>Veggie Supreme</Text>
          <Text style={styles.modaldesc}>
            Our Real Special marinara sauce with fresh tomatoes baked on our
            signature thin crust, baked to a perfect crisp. Cheesy mayo sauce
            and mozzarella, tomatoes, green pepper, onion
          </Text>
        </View>
      </Overlay>

      <Button title="Go to Tab2 " onPress={() => navigation.navigate('Tab2')} />
      <Button title="Go back" onPress={() => navigation.goBack()} />
    </View>
  );
};

export default Tab1;

0 个答案:

没有答案