v2.5.2
Giriş yap

Reactnative Style

webdevyusuf
580 defa görüntülendi ve 1 kişi tarafından değerlendirildi

Öncelikle merhaba bir sorum olacak

/*Hani Css'de*/
.item .text {
    color: red; /*Mesela*/
}
/*şeklinde yazılıyor ya*/

Bunu React Native'de nasıl o elemanın içindeki şu eleman şeklinde yazarız veya yazabilir miyiz?

Cevap yaz
Cevaplar (1)
islamsanliturk
1469 gün önce

merhabalar;
css icin bu tarz kullanim mantikli ve populer olsa da react native icin bu mantikta bir kullanim dogru degil ve oldukca zor.
en basit ve okunulabilirligi yuksek, performansli sekilde bu isi cozmenin mantigi su sekilde.
ilgili component icerisinde bir stylesheet taniplayip onun altinda elemanlara ozel css girislerini yapabilirsin.
daha sonrasinda eleman ozelinde yazdigin css i cagirabilirsin ornek kodu asagiya birakiyorum.
react native stylesheet aramasinda sana bir cok konuda yardimci olur.

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';

const LotsOfStyles = () => {
    return (
      <View style={styles.container}>
        <Text style={styles.red}>just red</Text>
        <Text style={styles.bigBlue}>just bigBlue</Text>
        <Text style={[styles.bigBlue, styles.red]}>bigBlue, then red</Text>
        <Text style={[styles.red, styles.bigBlue]}>red, then bigBlue</Text>
      </View>
    );
};

const styles = StyleSheet.create({
  container: {
    marginTop: 50,
  },
  bigBlue: {
    color: 'blue',
    fontWeight: 'bold',
    fontSize: 30,
  },
  red: {
    color: 'red',
  },
});

export default LotsOfStyles;