javascript - 在React Native中将 Prop 传递到外部样式表中？

我是React和React Native的新手。目前，对于每个组件，我都将代码分为2个单独的文件:

index.js用于所有React代码，以及；

StyleSheet的

styles.js

是否可以将 Prop 传递到外部StyleSheet？

例:index.js:

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

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

示例styles.js:

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

上面的代码不起作用，但更多的地方只是为了使我明白我想做的事情。任何帮助深表感谢!

最佳答案

创建一个将iconColor和iconSize作为参数并返回StyleSheet对象的类

// 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')
}

关于javascript - 在React Native中将 Prop 传递到外部样式表中？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/42707327/