如何在没有导航的情况下创建抽屉菜单？

Question

我想创建一个类似于抽屉导航器的抽屉，但没有 routes/navigation 要求。

我计划在那里放置一些更新查询的其他组件。有什么建议吗？具体来说，抽屉将用于显示选项列表、滑块和日期范围组件，这些组件将更新用于更新主页显示的地图上呈现的标记的状态和变量。

Answer 1

使用 Redux

您可以使用 createDrawerNavigator 的 contentComponent 创建您自己的自定义抽屉并将其绑定到 redux-store。

通过使用相关查询调度 actions，您可以在变量从商店传递到您的组件时更新变量。

没有 Redux

您可以创建一个具有类似动画的 CustomDrawer 组件并在您的组件中渲染它，或者使用此 react-native-drawer.

import Drawer from 'react-native-drawer'

class Application extends Component {  
  closeControlPanel = () => {
    this._drawer.close()
  };
  openControlPanel = () => {
    this._drawer.open()
  };
  render () {
    return (
      <Drawer
        ref={(ref) => this._drawer = ref}
        content={<DrawerContentComponent {...// Your Updater props}/>}
        >
        <Component />
      </Drawer>
    )
  }
})

如何在没有导航的情况下创建抽屉菜单？

How to Create Drawer menu without Navigation?

drawer

navigation-drawer

react-native

使用 Redux

没有 Redux