Change text inside touchable opacity on click

Question

I want to change the text inside my touchable opacity to another text on press event. Below is my code

<TouchableOpacity
        disabled={this.state.ButtonStateHolder}
        onPress={this.onPressConfirm}
        style={styles.button}
      >
        <View
          style={[
            styles.button1,
            {
              backgroundColor: this.state.ButtonStateHolder
                ? "#607D8B"
                : "#8c0d04"
            }
          ]}
        >
          <Text style={styles.buttontext}>Confirm</Text>
        </View>
      </TouchableOpacity>

Here I want to changethe text confirm to Parked on press event. How do I do that

Answer 1

You must initialize the state text to 'Confirm'. And the TouchableOpacity will be like this:

<TouchableOpacity
    disabled={this.state.ButtonStateHolder}
    onPress={() => {this.setState({text: 'Parked'})}}
    style={styles.button}
>
    <View
        style={[
            styles.button1,
            {
                backgroundColor: this.state.ButtonStateHolder
                    ? "#8c0d0488"
                    : "#8c0d04ff"
            }
        ]}
    >
        <Text style={styles.buttontext}>{this.state.text}</Text>
    </View>
</TouchableOpacity>