android - TouchableHighlight onPress 在导航时自动触发

Question

我的 React native 应用程序中有两个 View 。我正在使用 reactnavigtion 转到第二个 View 。下面是该代码。

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

                            </View>
    </TouchableHighlight>

以上代码运行良好。在第二个 View 中，我添加了链接以在用户点击它时在网络浏览器中打开。

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

                        </View>
 </TouchableHighlight>

下面是方法。

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

问题是当我点击转到第二个 View 时。它也会自动触发第二个 View _onPressButton 函数。这在 iOS 和 Android 中都发生了。

Answer 1

您使用的语法将在每次渲染时调用该函数，这就是它立即触发的原因。您必须将其放入匿名函数或为其创建一个方法。

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

或者定义一个使用该参数的方法

<TouchableHighlight onPress={this.navigateToSomeURL}>