未定義是不是一個對象（評估_this2_.drawer.open）當使用參考道具

Question

我一直在嘗試通過使用ref prop作爲建議 by these docs反應本機抽屜工作，但我得到以下錯誤：undefined is not an object (evaluating _this2_.drawer.open)我已經在堆棧溢出中梳理了類似的問題，並且很難將錯誤文本連接到任何一個問題，爲什麼會發生這種情況？

import React, { Component } from 'react'; 
import Drawer from 'react-native-drawer' 
import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View, 
    Button 
} from 'react-native'; 


class Project extends Component { 
    closeDrawer =() => { 
    this._drawer.close() 
    }; 
    openDrawer =() => { 
    this._drawer.open() 
    }; 
    render() { 
     return (
     <Drawer 
     ref={(ref) => this._drawer = ref} 
     content={<Menu 
        close={this.closeDrawer()} 
        />} 
      > 
     <Main 
      open={() => {this.openDrawer()}} 
      /> 
     </Drawer> 
    ) 
    } 
    } 

    class Menu extends Component { 
    render() { 
     return (
     null 
    ); 
    } 
    } 

    class Main extends Component { 
    render() { 
     return (
     <View> 
     <Button 
      title='Open' 
      onPress={this.props.open} 
      /> 
     </View> 
    ) 
    } 
} 
AppRegistry.registerComponent('Project',() => Project); 

Answer 1

您不能在回調中使用'this'。您應該在班級中定義方法，然後調用它們。

closeControlPanel =() => { 
    this._drawer.close() 
    }; 
    openControlPanel =() => { 
    this._drawer.open() 
    }; 

，然後像

<Drawer 
    ref={(ref) => this._drawer = ref} 
    content={<Menu 
       close={this.closeControlPanel()} 
       />} 
     > 
    <Main 
     open={() => {this.openControlPanel()} 
     /> 
    </Drawer> 

此外，

class Main extends Component { 
    render() { 
     return (
     <View> 
     <Button 
      title='Open' 
      onPress={this.props.open} 
      /> 
     </View> 
    ) 
    } 
}