React Native：使用 React Native Router Flux 在场景导航时关闭抽屉答案

【问题标题】：React Native: Closing Drawer Upon Scene Navigation Using React Native Router FluxReact Native：使用 React Native Router Flux 在场景导航时关闭抽屉
【发布时间】：2016-12-22 21:35:23
【问题描述】：

我在创建 React Native 应用程序时使用了以下组件：

对于抽屉，我希望在我按下链接导航到新场景时关闭它。

我的抽屉内容是这样定义的，使用 react-native-router-flux 'Actions'：

<ListItem>
    <Text onPress={Actions.treatments}>Treatments</Text>
</ListItem>

导航部分有效，但我迷失的是如何在按下其中一个链接时触发抽屉关闭。我怎么能做到这一点？

【问题讨论】：

标签： javascript react-native reactjs-flux

【解决方案1】：

经过反复试验找到了答案：

<ListItem>
    <Text onPress={() => { Actions.treatment(); this.context.drawer.close(); }}>Treatment</Text>
</ListItem>

就我而言，关闭抽屉需要上下文。在其他情况下，它可能像drawer.close(); 一样简单

【讨论】：

【解决方案2】：

我的解决方案将道具从抽屉传递到 {this.drawer.close() }/> 然后，在 Menupanel 组件中使用 this.props.closePanel() 。

<Drawer
        type="overlay"
        side="right"  
        tapToClose={true}
        openDrawerOffset={0.2}
        ref={(ref) => this._drawer = ref}
        content={<ControlPanel  closePanel={ ()=>{this.drawer.close() } />}
        >
        </Home>
</Drawer>

【讨论】：