RN-在样式声明中使用道具

Question

我想使用prop值动态添加颜色-与父视图相关。

我有以下内容-

  <Text style={[copyStyles.copyrightTxt, copyStyles.copyColor{this.Props.Color}]}>&copy; Copyright 2019 LRM Security Ltd</Text>

可以通过以下方式设置样式：

const copyStyles = StyleSheet.create({

  copyColorOrange:{
    color:'#f79431',
  }
 });

但是我收到了一个“意外令牌”错误-有人可以告诉我我要去哪里了吗？

Answer 1

您可以通过两种方式访问​​对象的属性：

objectName.propertyName

或者您可以使用允许您使用字符串的另一种方式

objectName["propertyName"]

您应该使用另一种方法，通过构造所需的字符串来访问样式对象内的值。

 copyStyles[`copyColor${this.props.Color}`]

props也不全是小写吗？

Answer 2

更好的方法是嵌套您的媒体资源：

const copyStyles = {   
copyColor:{
    Orange:{
        color:'#f79431',
    }
  }
 };

并使用：copyStyles.copyColor [this.props.Color]