Question

我的视野中有3个TouchableHighLight。所有的文字颜色都是白色。我希望当我按下按钮之一时，文本颜色将变为绿色。但是当我按下它时，按钮中的所有文本颜色将变为绿色。请帮助我。

Answer 1

请尝试此操作，您可以在构造函数中将默认颜色初始化为白色，然后为您使用其他按钮，希望这会有所帮助。

<TouchableHighLight style = {{height: 20, width:20}} onPress = {()=> this.setState(colorCode: 'green')}>
<Text>{this.state.colorCode}</Text>
</TouchableHighLight>

Answer 2

您必须使用样式属性来更改文本的颜色。像这样

style = {{color：this.state.colorCode}}

您还可以使用不带状态的默认值

style = {{color：this.state.colorCode || “您的默认颜色” }}

Answer 3

这是我的代码： this.state = { textColor：“白色” }

_onPressIn = () => {
    this.setState({
        textColor: 'green'
    });
}

_onPressOut = () => {
    this.setState({
        textColor: 'white'
    });
}

登录

我有三个这样的按钮，我想当我单击一个按钮时只更改文本颜色，另一个文本按钮不更改

Answer 4

在这种情况下，我建议使用Pressable API及其子属性。

      <Pressable
        children={({ pressed }) => (
          <Text style={{ color: pressed ? '#FF9E00' : '#222'}}>
            text
          </Text>
        )}/>

这样，当单击一个项目时，只有该项目会更改颜色。

通过在React Native上使用onPress更改文本颜色

4 个答案: