React Native'de Koşullu Olarak Oluşturma

Question

Genel olarak yerel ve kodlamaya tepki verme konusunda oldukça yeniyim. Metni bazı değişkenlere göre oluşturmam gerekiyor (aşağıya bakın).

eğer isPlayer === true && base.length === 1, x render

else if isPlayer === true && base.length > 1, render y

Aksi takdirde z render

Aşağıda üzerinde çalıştığım kod pasajı ve metni nerede oluşturmam gerektiğini işaretledim. İf / else mantığıyla bir işlev yazmayı ve ardından işlevi çağırmayı denedim ancak işe yaramadı. JSX ile satır içi koşullu oluşturma yapabileceğinizi biliyorum, ancak bunu da çalıştıramadınız. Her türlü yardım için minnettarız! Şimdiden teşekkürler!

<View style={{ marginTop: marginTopAdj, flexDirection: 'row' }}>
          <TouchableOpacity onPress={() => navigation.goBack()} style={{}}>
            {IconWhiteBackButton}
          </TouchableOpacity>

          <HeaderTitle
            containerStyle={styles.headerTitleContainer}
            textStyle={{ color: '#fff' }}
          >
            {Item to be conditionally rendered}
          </HeaderTitle>
</View>

Answer 1

<View style={{ marginTop: marginTopAdj, flexDirection: 'row' }}>
          <TouchableOpacity onPress={() => navigation.goBack()} style={{}}>
            {IconWhiteBackButton}
          </TouchableOpacity>

          <HeaderTitle
            containerStyle={styles.headerTitleContainer}
            textStyle={{ color: '#fff' }}
          >
            {isPlayer === true && base.length === 1 && <ItemX/>}
            {isPlayer === true && base.length > 1 && <ItemY/>}
          </HeaderTitle>
</View>

Daha karmaşık mantık için yeni bir işlev oluşturun:

renderItemConditionally = () => {
  if (...) return <ItemX/>;
  else if (...) return <ItemY/>;
  else return <ItemZ/>;
}

Daha fazla bilgi için bunu okuyun .