Requisiten in externes Stylesheet in React Native?

Question

Ich bin neu zu reagieren und reagieren native. Im Moment für jede Komponente bin gegen ich den Code in zwei separaten Dateien:

1. index.js für den gesamten Code Reaktion, und;
2. styles.js für die Stylesheet-

Gibt es eine Möglichkeit Requisiten in das externe Stylesheet übergeben?

Beispiel: index.js:

render() { 
 
    const iconColor = this.props.color || '#000'; 
 
    const iconSize = this.props.size || 25; 
 

 
    return (
 
    <Icon style={styles.icon} /> 
 
); 
 
}

Beispiel styles.js:

const styles = StyleSheet.create({ 
 
    icon : { 
 
    color: iconColor, 
 
    fontSize: iconSize 
 
    } 
 
});

Der obige Code funktioniert nicht, aber es ist mehr, um den Punkt zu verdeutlichen, was ich versuche zu tun. Jede Hilfe wird sehr geschätzt!

Answer 1

Erstellen Sie eine Klasse, die iconColor und iconSize als Argumente und gibt ein Stylesheet-Objekt

// styles.js 

export default class StyleSheetFactory { 
    static getSheet(iconSize, iconColor) { 
     return StyleSheet.create({ 
      icon : { 
       color: iconColor, 
       fontSize: iconSize 
      } 
     }) 
    } 
} 

// index.js 

render() { 
    let myStyleSheet = StyleSheetFactory.getSheet(64, 'red') 
}