So übergeben Sie navigator.pop an benutzerdefinierte native Komponente reagieren

Question

Ich möchte mein Navigationsmenü in eine benutzerdefinierte Komponente extrahieren, damit ich nicht ständig den Code neu schreiben muss. Hier ist meine einfache dashboard.js

import React, { Component } from 'react'; 
import { 
    StyleSheet, 
    View, 
    Text, 
    Navigator, 
    TouchableHighlight, 
    TouchableOpacity, 
} from 'react-native'; 

let HeaderMenu = require('../../partials/headerMenu'); 

class Dashboard extends Component { 
    render() { 
    return (
     <HeaderMenu/> 
    ); 
    } 
} 
module.exports = Dashboard; 

hier mein headerMenu.js ist

import React, { Component } from 'react'; 
import { 
    StyleSheet, 
    Text, 
    View, 
    TouchableOpacity, 
    Navigator 
} from 'react-native'; 

class HeaderMenu extends Component { 
    render() { 
    return (
     <View> 
     <Text>Header Menu</Text> 
     <TouchableOpacity onPress={()=>{this.props.navigator.pop()}}> 
     <Text>BACK</Text> 
     </TouchableOpacity> 
    </View> 
    ); 
    } 
} 

module.exports = HeaderMenu; 

Meine Frage ist, wie kann ich weitergeben müssen:

this.props.navigator.pop() 

von meiner dashboard.js Datei zu meiner headerMenu.js Datei so funktioniert die Zurück-Taste?

Answer 1

Sie können von dashboard.js in headerMenu.js im Navigator-Objekt übergeben:

<HeaderMenu navigator={your_navigator_object}/> 

Dann this.props.navigator.pop() in headerMenu.js Aufruf sollte funktionieren.