React native [反应本机模式]:onBackButtonPress道具不返回任何内容

React native [反应本机模式]:onBackButtonPress道具不返回任何内容,react-native,callback,react-native-android,console.log,react-native-modal,React Native,Callback,React Native Android,Console.log,React Native Modal,我试图用onBackButtonPress道具定制我的模态。为了检查它是否工作,我向它传递了一个console.log,如下所示: <Modal onBackButtonPress={() => console.log('Something')}> <NewRidesModal //... /> </Modal> console.log('Something')}> 但事实上,每当我按下Android后退按钮时,它甚至都不

我试图用onBackButtonPress道具定制我的模态。为了检查它是否工作,我向它传递了一个
console.log
,如下所示:

<Modal onBackButtonPress={() => console.log('Something')}>
    <NewRidesModal
      //...
    />
</Modal>
console.log('Something')}>
但事实上,每当我按下Android后退按钮时,它甚至都不会返回任何内容。
为什么他根本不返回任何值?是否已弃用?

我也使用此库,并且onBackButtonPress工作正常。 我面临另一个问题,在我的情况下onBackdropPress不起作用,但在我修复了我的样式模式后,一切正常

这是我的例子,, 模态js


我发现onBackButtonPress已被弃用或实际上已被删除。文档中应该有更多关于这方面的信息

import React, { Component } from 'react'
import { View, Text, Image, TouchableOpacity } from 'react-native'
import styles from '../styles/StyleComponentModalProduct'
import { withNavigation } from 'react-navigation'
import Price from '../../../assets/components/price/Price'
import Modal from 'react-native-modal'
class ComponentModalProduct extends Component {
  constructor(props) {
    super(props)
    this.state = {}
  }

  render() {
    return (
      <Modal
        useNativeDriver={true}
        animationIn={'fadeIn'}
        animationOut={'fadeOut'}
        backdropColor={'rgba(0, 0, 0, 0.7)'}
        backdropOpacity={0.5}
        isVisible={this.props.showProduct}
        onSwipeComplete={() => this.props.close()}
        swipeDirection={['down']}
        style={{ justifyContent: 'flex-end', margin: 0 }}
        onBackButtonPress={() => this.props.close()}
        onBackdropPress={() => this.props.close()}>
        <View style={styles.container}>
          <View style={styles.subContainer}>
            <View style={styles.headerContainer}>
              <TouchableOpacity
                onPress={() => this.props.close()}
                style={styles.closButton}
              />
              <View style={styles.containerImageProfile}>
                <Image
                  resizeMode={'contain'}
                  style={styles.imageProfile}
                  source={{ uri: this.props.selectedProduct.foto }}
                />
              </View>
              <View style={styles.containerProfile}>
                <View style={styles.containerTextName}>
                  <Text style={styles.textName}>
                    {this.props.selectedProduct.nama_produk}
                  </Text>
                </View>
                <Price
                  value={this.props.selectedProduct.harga_beli}
                  style={styles.textProfesi}
                />
              </View>
            </View>
          </View>
        </View>
      </Modal>
    )
  }
}

export default withNavigation(ComponentModalProduct)
import { StyleSheet, Dimensions } from 'react-native'
import { color } from '../../../assets/styles/ColorList'
import {
  responsiveHeight,
  responsiveFontSize,
  responsiveWidth
} from 'react-native-responsive-dimensions'
const windowHeight = Dimensions.get('window').height
const styles = StyleSheet.create({
  container: {
    justifyContent: 'flex-end',
    alignItems: 'center'
  },
  subContainer: {
    height: windowHeight / 2,
    backgroundColor: color.whiteColor,
    width: '100%',
    borderTopRightRadius: 20,
    borderTopLeftRadius: 20,
    paddingHorizontal: responsiveWidth(5),
    paddingVertical: responsiveHeight(3)
  },
  headerContainer: {
    justifyContent: 'center',
    alignItems: 'center'
  },
  closButton: {
    backgroundColor: '#E7E7E7',
    height: 8,
    width: 100,
    marginVertical: 10
  },
  containerImageProfile: {
    marginVertical: 10,
    width: '100%',
    justifyContent: 'center',
    alignItems: 'center'
  },
  imageProfile: {
    height: windowHeight / 3.5,
    width: '90%',
    borderRadius: 20
  },
  containerProfile: {
    justifyContent: 'center',
    alignItems: 'center'
  },
  containerTextName: {
    marginHorizontal: responsiveWidth(10),
    justifyContent: 'center'
  },
  textName: {
    fontSize: responsiveFontSize(2.5),
    color: color.fontColor,
    textAlign: 'center'
  },
  textProfesi: {
    fontSize: responsiveFontSize(2.5),
    color: color.fontColor,
    fontWeight: 'bold'
  }
})

export default styles