React Native - TouchableOpacity onPressOut не работает внутри FlatList - PullRequest
0 голосов
/ 11 февраля 2020

Я помещаю TouchableOpacity в FlatList внутри ListHeaderComponent Props, когда я вызываю onPressOut методы, это не срабатывает. Это работа в Экспо, но в любом случае это не работа, я надеюсь, что это не ошибка, поэтому я могу продолжать работать с плоским списком. https://snack.expo.io/@gigapudding / hello-world . обновлять при запуске на android, это тоже не работает

 <View style={{flex:1}} >
      <FlatList
                onScroll={(data)=>{
                  console.log(data.nativeEvent)
                }}
                keyExtractor={(item)=>item.id.toString()}
                ref={(ref)=>this.flatList=ref}
                style={{
                  position  : 'absolute',
                  top       : 0,
                  height    : wHeight,
                  width     : width,
                }}
                showsVerticalScrollIndicator={false}
                ListHeaderComponent={()=>(
                  <View
                    style={{backgroundColor:'red'}}
                  >
                      <TouchableOpacity
                        activeOpacity={1}
                        onPressIn={()=>{
                          console.log('in')
                          this.setState({cameraButton:true})
                        }}
                        onPressOut={()=>{
                          console.log('out')
                          this.setState({cameraButton:false})
                        }}

                        style={[
                          {
                            width         : width*0.15,
                            height        : width*0.15,
                            borderRadius  : 100,
                            borderWidth   : 1,
                            borderColor   : '#fff',
                          },
                          this.state.cameraButton&&{backgroundColor:'#fff'}
                        ]}
                      />
                    </View>
                )}
              />
  </View>
...