React Native Button not working when nested

Question

Just started with react native and I am not able to get button working Button 1 is working as expected but button 2 is nested and not working

``` import { StyleSheet, View, Text, Button, TouchableHighlight } from "react-native"; import { Col, Row, Grid } from "react-native-easy-grid";

sayHi = from => {
    alert(from + " was clicked");
  };

  render() {
    return (
      <View style={styles.container}>
        <Button
          title="BUTTON 1"
          accessibilityLabel="THIS IS BUTTON 1"
          onPress={() => {
            this.sayHi("Button 1");
          }}
        />
        <Grid>
          <Col>
            <Text> col 1</Text>
            <TouchableHighlight
              style={{
                height: 40,
                width: 100
              }}
              onPress={() => {
                this.sayHi("highlight");
              }}
              underlayColor="red"
            >
              <Button
                title="BUTTON 2"
                accessibilityLabel="THIS IS BUTTON 2"
                onPress={() => {
                  this.sayHi("Button 2");
                }}
              />
            </TouchableHighlight>
          </Col>
          <Col>
          </Col>
        </Grid>
      </View>
    );