0

tengo la funcion SideMenu, y la quiero llamar dentro de mi componente Header, los dos se encuentran en la misma clase...

Aqui adjunto mi funcion SideMenu :

const SideMenu = () => {
        return (
            <SafeAreaView style ={{flex : 1 }}>
                <View style = {{
                    height : 150,
                    alignItems: 'center',
                    justifyContent: 'center'
                }}>
                    <Text>MotherF*cker</Text>
                    <ScrollView>
                        <List>
                            <ListItem>
                                <Text>gfdsgfdsg</Text>
                            </ListItem>
                        </List>
                    </ScrollView>
                </View>
            </SafeAreaView>
        )
    }

Aqui tengo la funcion Header

const HomeScreen = ({ navigation }) => {
    return (

        <View style={styles.container}>
            <Header component={SideMenu}/>
            <Text>hehe</Text>

            <Button
            title = "Go!"
            onPress= {() => navigation.navigate('Detalle', { title : '432354', user_name:'Josefina'})}
            />
        </View>

    )
};

2
  • Y cual es el error? Commented el 24 jul. 2020 a las 23:20
  • El error es el siguiente: fn is not a function”?...pero si que es una funcion....
    – Iron Man
    Commented el 24 jul. 2020 a las 23:45

1 respuesta 1

1

El problema es que SideMenu no es una función sino un componente. y deberías llamarlo así:

import { sideMenu } from".../tuRuta"

const HomeScreen = ({ navigation }) => {
    return (

        <View style={styles.container}>
            <Header component={<SideMenu/>}/>
            <Text>hehe</Text>

            <Button
            title = "Go!"
            onPress= {() => navigation.navigate('Detalle', { title : '432354', user_name:'Josefina'})}
            />
        </View>

    )
};

Recuerda que tienes que exportar el componente de sideMenu:

export const SideMenu = () => {
        return (
            <SafeAreaView style ={{flex : 1 }}>
                <View style = {{
                    height : 150,
                    alignItems: 'center',
                    justifyContent: 'center'
                }}>
                    <Text>MotherF*cker</Text>
                    <ScrollView>
                        <List>
                            <ListItem>
                                <Text>gfdsgfdsg</Text>
                            </ListItem>
                        </List>
                    </ScrollView>
                </View>
            </SafeAreaView>
        )
    }

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.