Реакция this.props.navigation.openDrawer() в дочернем компоненте?

Question

У меня есть метод openDrawer через React Navigation 2, прекрасно работающий в моем представлении. Однако, когда я создаю дочерний компонент и помещаю в него свою кнопку openDrawer, я больше не могу получить доступ к this.props.navigation. Как передать это в дочерний компонент? Я посмотрел на состояние, но это, кажется, не правильный способ решить эту проблему? Я новичок в React/Native. Вот моя кнопка в главном окне, и она отлично работает.

<View style={styles.menuBar}> 
<TouchableOpacity style={styles.menuButton} 
 onPress={() => this.props.navigation.openDrawer()}>
<Text>&#9776;</Text>
</TouchableOpacity>
// Other Stuff inside menuBar.
</View>

У этой кнопки меню также есть несколько других пунктов, и я хочу сгруппировать их в компоненте класса как дочерний элемент, который я могу просто импортировать на различные экраны.

import { topMenuBar } from '../components/menuBar';
<topMenuBar />

Однако кнопка меню больше не работает. Я знаю, что это потому, что this.props теперь ссылается на класс topMenuBar, а не на исходный класс, который является частью структуры nav. Но я не знаю правильную процедуру для этого шага, использует ли он состояние или вызывает NavigationActions из response-navigation в дочернем методе.

Спасибо за помощь!

Answer 1

Каждый компонент, открытый с помощью response-navigation, имеет "this.props.navigation".

Если вам это нужно в дочерних компонентах, вы должны передать их в качестве опоры:

export default class Home extends Component{
    render(){
        <View>
            <OtherComponent navigation = {this.props.navigation}/>
        </View>
    }
}

Примечание: если вам нужна лучшая помощь, вы всегда должны предоставлять код, создающий скрипку, и лучше организовывать свои ответы.