使用 TouchableHighlight 更改字体颜色

Question

如何更改按钮的字体颜色，问题是字体颜色看起来不太好，所以每次用户点击按钮时我也需要更改字体颜色。

我的做法：

普通按钮

按下按钮

<TouchableHighlight
        underlayColor="#E5E6EA"
        onPress={onOpen2}
        style={{
          fontFamily: "AktivGroteskCorp",
          paddingLeft: 15,
          paddingRight: 15,
          borderRadius: 25.5,
          flexDirection: "row",
          justifyContent: "center",
          marginBottom: 15,
          width: vw * 67.2,
          height: vw * 13.6,
          alignItems: "center",
          alignSelf: "center",
          borderColor: "#E5E6EA",
          borderWidth: 1,
        }}
      >
        <Text
          style={{
            color: "#ffffff",
            fontWeight: "bold",
            fontSize: 16,
            textAlign: "center",
            alignSelf: "center",
          }}
        >
          LOG IN
        </Text>
      </TouchableHighlight>

Answer 1

这是一个功能性的方法

首先，创建 useState 然后在 onPressIn/onPressOut 上操作它

const TouchableHighlightExample = () => {
  const [BtnColor, setBtnColor] = useState("red");
  return (
    <View>
      <TouchableHighlight onPressIn={()=>setBtnColor("blue")} onPressOut={()=>setBtnColor("red")}>
        <View>
          <Text style={{color: BtnColor}}>Touch Here</Text>
        </View>
      </TouchableHighlight>
    </View>
  );
}