reactjs 当页面等于配置文件时,我如何删除容器?

jdgnovmf  于 2022-12-22  发布在  React
关注(0)|答案(2)|浏览(114)

当页面等于配置文件时,我怎么才能删除容器?我想说,如果我的页面===到配置文件,那么视图将被删除,但设置应该是可见的,有人能告诉我如何做到这一点吗?配置文件是一个页面

import { StyleSheet, View, Image } from 'react-native'
import React from 'react'
import logo from '../../assets/Instagram_Logo.png';
import { icons1, logo2 } from '../CommonCss/PageCss';
import { Ionicons } from '@expo/vector-icons';

const TopNavbar = ({ navigation, page }) => {
    return (
        <View style={styles.container}>

            {
                page === 'home' ? <Image source={logo} style={logo2} /> :
                    <Image />
            }
            {
                page === 'home' &&
                <Ionicons name="ios-chatbubbles-sharp"
                    size={24}
                    color="black"
                    style={icons1}
                    onPress={() => navigation.navigate('Chats')}
                />
            }
            {
                page === 'profile' &&
                <Ionicons name="settings-sharp"
                    size={24}
                    color="black"
                    style={styles.icons11}
                    onPress={() => navigation.navigate('settings')}
                />
            }
        </View>

    )
}

export default TopNavbar

const styles = StyleSheet.create({
    container: {
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'space-between',
        width: '100%',
        paddingVertical: 10,
        position: 'absolute',
        top: 0,
        zIndex: 100,
        backgroundColor: '#111111',
    },
    icons11: {
        color: 'white',
        fontSize: 30,
        marginRight: '3%'
    }
})
vfh0ocws

vfh0ocws1#

添加三元条件

<View style={page === 'profile' ? styles.container : {}}>
9nvpjoqh

9nvpjoqh2#

你是这个意思吗?

import { StyleSheet, View, Image } from 'react-native'
import React from 'react'
import logo from '../../assets/Instagram_Logo.png';
import { icons1, logo2 } from '../CommonCss/PageCss';
import { Ionicons } from '@expo/vector-icons';

const TopNavbar = ({ navigation, page }) => {
    return (
        <View style={styles.container}>
            {page === profile ?(
                <Ionicons name="settings-sharp"
                    size={24}
                    color="black"
                    style={styles.icons11}
                    onPress={() => navigation.navigate('settings')}
                />
            ):(
            {
                page === 'home' ? <Image source={logo} style={logo2} /> :
                    <Image />
            }
            {
                page === 'home' &&
                <Ionicons name="ios-chatbubbles-sharp"
                    size={24}
                    color="black"
                    style={icons1}
                    onPress={() => navigation.navigate('Chats')}
                />
            }
            {
                page === 'profile' &&
                <Ionicons name="settings-sharp"
                    size={24}
                    color="black"
                    style={styles.icons11}
                    onPress={() => navigation.navigate('settings')}
                />
            }
            )
        </View>

    )
}

相关问题