Javascript 是否可以根据值更改文本颜色？（本地反应）

我在使用React native的应用程序中工作，下面是我遇到麻烦的代码：

import React, { Component } from "react";
import { Text, StyleSheet } from "react-native";
import { Content, Card, CardItem, Body, Left } from "native-base";
import { PricingCard } from "react-native-elements";

export default class AppBodyData extends Component {
  render() {
    let articles = this.props.data.map(function (articleData, index) {
      return (
        <PricingCard
          //color='#ff3300'
          wrapperStyle={
            articleData.percent_change_1h >= 0 ? styles.green : styles.red
          }
          info={[
            "1h change: " + articleData.percent_change_1h,
            "24h change: " + articleData.percent_change_24h,
            "7days change: " + articleData.percent_change_7d,
          ]}
          button={{
            title: "More information",
            icon: "info",
            backgroundColor: "#4f9deb",
          }}
        />
      );
    });

    return <Content>{articles}</Content>;
  }
}

const styles = StyleSheet.create({
  green: {
    color: "#00ff00",
  },
  red: {
    color: "#ff0000",
  },
});

module.export = AppBodyData;

import React，{Component}来自“React”；
从“react native”导入{Text，StyleSheet}；
从“本机库”导入{Content、Card、CardItem、Body、Left}；
从“react native elements”导入{PricingCard}；
导出默认类AppBodyData扩展组件{
render（）{
让articles=this.props.data.map（函数（articleData，index）{
返回(
=0？样式。绿色：样式。红色
}
信息={[
“1h变化：“+articleData.percent_change_1h，
“24小时变化：“+articleData.percent_change_24小时，
“7天变更：“+articleData.percent_change_7d，
]}
钮扣={{
标题：“更多信息”，
图标：“信息”，
背景色：“4f9deb”，
}}
/>
);
});
返回{articles}；
}
}
const styles=StyleSheet.create({
绿色：{
颜色：“00ff00”，
},
红色：{
颜色：“ff0000”，
},
});
module.export=AppBodyData；

我需要的是，如果

articleData.percent\u change\u 1h

变量为正则该变量的颜色必须为绿色，否则必须为红色

PricingCard是react本机元素库的对象：

提前感谢

您可以使用操作传递给您的

PricingCard的
包装器样式
道具

// Stylesheet.
import { StyleSheet } from 'react-native'

// Card.
<PricingCard wrapperStyle={(articleData.percent_change_1h >= 0) ? styles.green : styles.red} ../>

// Styles.
const styles = Stylesheet.create({
  green: {
    color: '#00ff00'
  },
  red: {
    color: '#ff0000'
  }
})

//样式表。
从“react native”导入{StyleSheet}
//卡片。
= 0) ? style.green:style.red}../>
//风格。
const styles=Stylesheet.create({
绿色：{
颜色：“#00ff00”
},
红色：{
颜色：“#ff0000”
}
})
很抱歉，我没有指定要更改变量而不是孔对象OK，确定。我的猜测是通过
wrapperStyle
操作
color
属性。我刚刚上传了所有代码，因为通过您的解决方案，我得到了一个警告，即props.wrapperStyle中不存在键“color”。我已经将颜色更改为backgroundColor，它可以工作，但它更改了所有背景，我只想更改articleData.percent_change_1h值颜色。谢谢，我刚刚更改了标签的信息，并与包装样式链接，然后它就开始滚动了。；）