React-Native Android硬件上的错误BackButton点击“Undefined不是一个函数（评估'_this2.close（）'）”

Question

我已经安装了react-native-orientation-loading-overlay软件包，用于在屏幕上应用加载程序。 当用户单击硬件后退按钮时，将调用backAndroid的addEventListener。 根据条件，loader的动画属性设置为true，并且方向加载器开始加载。 在加载时，另一个函数this.fetchData()开始运行，它通过运行webservice获取数据并显示在同一页面的列表视图中，即mainPage。 并且在加载时，如果用户再次按下后退按钮，则红色屏幕显示错误“未定义不是函数（评估_this2.close() ）onRequestClose方法的react-native-orienation-loading-overlay \\ src \\ index .js文件“显示。我试过BackAndroid.removeEventListener('hardwareBackPress', () => {}); 在loader的动画属性设置为true但它不起作用之后。 请给我任何解决方案。

  import OrientationLoadingOverlay from 'react-native-orientation-loading-overlay';


   <OrientationLoadingOverlay
     visible={this.state.animating}
     color="#6495ed"
     indicatorSize="large"
     messageFontSize={16}
     message="Loading..."
   />

我的硬件后退点击事件监听器代码如下：

   BackAndroid.addEventListener('hardwareBackPress', () => {
     if(this.state.drawerState===true) {
       this.refs['draw'].closeDrawer();
     } else {
       if(this.props.navigator.getCurrentRoutes().length===1&&
         this.state.tagPressed===false){
         if (stack.length===0){
           Alert.alert(
             'Exit',
             'Are you sure?',
             [
               {text: 'Cancel', onPress: () => {return true;}},
               {text: 'Yes', onPress: () => BackAndroid.exitApp()},
             ],
           )
         } else {
           this.backButtonEvent();
         }
       } else {
         if(this.props.navigator.getCurrentRoutes().length===1&&
           this.state.tagPressed===true) {
           this.setState({ animating: true });
           this.setState({ tagPressed: false });
           this.setState({ title: 'Repository' });
           this.fetchData();
         } else {
           this.props.navigator.pop();
         }
       }
     }
     return true;
   });

这里stack.length是导航路径数组的长度。 而我的backButtonEvent()函数如下：

   backButtonEvent() {
     if(stack.length===0) {
       this.refs['draw'].openDrawer();
     } else{
       this.setState({animating:true});
       dirPath = stack.pop();
       title = this.titleStack.pop();
       if(stack.length===0) {
         this.setState({srcUrl:require('../image/drawer1.png')});
         this.setState({drawerLock:'unlocked'});
       }
       this.fetchData();
     }  
   }

 <ListView 
   dataSource={this.state.dataSource}
   renderRow={(this.renderItem.bind(this))}
   enableEmptySections = {true}
 />  

fetchData(data){
  this.setState({
    dataSource: this.state.dataSource.cloneWithRows(data)
  });
}

Answer 1

请参阅react-native-orientation-loading-overlay的源代码第82行，它使用函数this.close()来关闭模态，但是当参考RN 0.41文档时 ， this.close()不是pre - 模态的定义函数，因此它在typeof this.props.children === 'undefined'时触发了上述错误。 这是包的错误。 它可能具有新状态来控制模态的开/关，并允许this.close（）函数将状态更改为关闭模态。