0

离线时touchableopacity不起作用，有时它需要很慢，比如需要几分钟才能运行onPress

<TouchableOpacity
      onPress={() => this.example()}
      style={{padding: 10, justifyContent: 'center', flexDirection: 'row', backgroundColor: '#F26525', width: Dimensions.get('screen').width * 0.8, borderRadius: 3, marginTop: 15}}>
      <Icon name='refresh' size={20} color='#ffffff' />
      <Text style={{fontSize: 16, color: '#ffffff', fontFamily: 'Quicksand-Medium'}}> Try Again</Text>
    </TouchableOpacity>

我使用：react-native-cli：2.0.1 react-native：0.55.1

我试图改变成touchablewithoutfeedback，但它仍然一样

感谢您的帮助 ，

4

2 回答 2

0

我认为你应该在 touchableOpacity 中只使用一个组件，所以这样做：

 <TouchableOpacity
      onPress={() => this.example()}
      style={{padding: 10, justifyContent: 'center', flexDirection: 'row', backgroundColor: '#F26525', width: Dimensions.get('screen').width * 0.8, borderRadius: 3, marginTop: 15}}>
      <View>
         <Icon name='refresh' size={20} color='#ffffff' />
         <Text style={{fontSize: 16, color: '#ffffff', fontFamily: 'Quicksand-Medium'}}> Try Again</Text>
      </View>
    </TouchableOpacity>
于 2018-12-18T06:41:41.063 回答
0

你将不得不像这样绑定你的函数。

<TouchableOpacity
      onPress={this.example.bind(this)}
      style={{padding: 10, justifyContent: 'center', flexDirection: 'row', backgroundColor: '#F26525', width: Dimensions.get('screen').width * 0.8, borderRadius: 3, marginTop: 15}}>
      <Icon name='refresh' size={20} color='#ffffff' />
      <Text style={{fontSize: 16, color: '#ffffff', fontFamily: 'Quicksand-Medium'}}> Try Again</Text>

或者你也可以在你的构造函数中绑定你的函数

constructor(props) {
super(props)
this.example = this.example.bind(this)
}

<TouchableOpacity
      onPress={this.example}
      style={{padding: 10, justifyContent: 'center', flexDirection: 'row', backgroundColor: '#F26525', width: Dimensions.get('screen').width * 0.8, borderRadius: 3, marginTop: 15}}>
      <Icon name='refresh' size={20} color='#ffffff' />
      <Text style={{fontSize: 16, color: '#ffffff', fontFamily: 'Quicksand-Medium'}}> Try Again</Text>

或者像这样

<TouchableOpacity
      onPress={() => {console.log('Pressed!')}}
      style={{padding: 10, justifyContent: 'center', flexDirection: 'row', backgroundColor: '#F26525', width: Dimensions.get('screen').width * 0.8, borderRadius: 3, marginTop: 15}}>
      <Icon name='refresh' size={20} color='#ffffff' />
      <Text style={{fontSize: 16, color: '#ffffff', fontFamily: 'Quicksand-Medium'}}> Try Again</Text>
于 2018-12-18T02:42:11.753 回答