display a Link button instead of button

Question

I want to display a link button instead of button on my react native page. Right now I have the below code:

<Button onPress={this.handleGetDirections} title="Get Directions" />

I want to show the above button as a link. How can I achieve this in React Native.

Thank You.

something like this? check it out https://stackoverflow.com/questions/30540252/display-hyperlink-in-react-native-app?utm_medium=organic&utm_source=google_rich_qa&utm_campaign=google_rich_qa — Se0ng11, Apr 17 '18 at 02:58
Possible duplicate of [Display hyperlink in React Native App](https://stackoverflow.com/questions/30540252/display-hyperlink-in-react-native-app) — Pritish Vaidya, Apr 17 '18 at 03:58
I don't have a url. I just wantto go to certain page that exists in my application when user clicks on that directions link — Anjali, Apr 17 '18 at 05:25
Hii, try this https://github.com/obipawan/react-native-hyperlink — , Apr 17 '18 at 05:56

score 1 · Answer 1 · answered Apr 17 '18 at 04:33

If it is about the styling of a link within the browser. That's done by the default browser vendor styles. You won't have that happen in react-native.

You can have a simple Text element that is styled to look like a link (ie: blue) and have a onPress handler for that.

Just follow Pritish Vaidyas... link :)

Hope this helps

score 1 · Accepted Answer · answered Apr 17 '18 at 06:59

1

Use textDecorationLine.

E.g :

 <TouchableOpacity>
        <Text style={styles.underLineText}>Your underline Text</Text>
      </TouchableOpacity>

underLineText: {
    fontSize: 12,
    textDecorationLine: 'underline',
    color: 'white',
    fontWeight: 'bold',
    textAlign: 'center',
  }

answered Apr 17 '18 at 06:59

Vivek_Neel

1,343
1
14
25

This works perfect, thanks! For anyone not aware, `TouchableOpacity` can be imported from `react-native`. – Matthew Herbst Nov 10 '20 at 05:59

display a Link button instead of button

2 Answers2