CODEWITHSUNDEEP
androidiosreact-nativenavigation
Im Batman
Im Batman

Reputation: 1876

TouchableHighlight onPress fires automatically on navigation

I have two views in my react native app. and im using reactnavigtion to go to second view. below is that code.

 <TouchableHighlight onPress={() => navigate('Detail', { title: 'Text' })}>
                            <View style={styles.box} >

                            </View>
    </TouchableHighlight>

and above code works fine. in second view i added link to open up in the web browser when user tap on it.

<TouchableHighlight onPress={this._onPressButton('http://www.someurl.com')}>
                        <View style={styles.box} >

                        </View>
 </TouchableHighlight>

and following is the method.

_onPressButton(url){
            const uri = url;
            Linking.openURL(uri).catch(err => console.error('An error occurred', err));
        }

Problem is when i click to goto second view. it automatically fires the second view _onPressButton function as well. this happening in both iOS and Android.

Upvotes: 0

Views: 791

Answers (1)

Matt Aft
Matt Aft

Reputation: 8936

The syntax you're using will invoke that function on every render which is why it's firing immediately. You have to either put it into an anonymous function or create a method for it.

<TouchableHighlight onPress={() => this._onPressButton('http://www.someurl.com')}>

or define a method that uses that argument

<TouchableHighlight onPress={this.navigateToSomeURL}>

Upvotes: 5

Related Questions