Question

使用react-native-navigation v1，您可以像这样设置抽屉：

library(shiny)
ui <- fluidPage(
  fluidRow(
    sliderInput("n", min = 0, max = 100, value = 50, label = "Choose a number"),
    actionButton("Print","Print the number"),
    verbatimTextOutput("num1"),
    actionButton("Add","Add +5 to the printed number"),
    verbatimTextOutput("num2")
  )
)

server <- function(input, output){
  all <- reactiveValues(
    n = 50,
    a = 55
  )

  observeEvent(input$Print,{
    all$n <- input$n
    output$num1 <- renderPrint(all$n)

    observeEvent(input$Add,{
      all$d <- input$n + 5
      output$num2 <- renderPrint(all$d)
    })

  })
}

shinyApp(ui = ui, server = server)

在react-native-navigation的文档中，他们提到仍然支持抽屉，

，但没有使用示例。我尝试了与v1中相同的方式，但是没有用。有谁以某种方式实现了它？

Answer 1

在RNN V2中，您可以仅使用sideMenu而不是旧的抽屉选项Ex来添加Drawer：

Navigation.events().registerAppLaunchedListener(() => {
  Navigation.setRoot({
    root: {
      sideMenu: {
        id: "sideMenu",
        left: {
          component: {
            id: "Drawer",
            name: "navigation.Drawer"
          }
        },
        center: {
          stack: {
            id: "AppRoot",
            children: [{
              component: {
                id: "App",
                name: "navigation.AppScreen"
              }
            }]
          }
        }
      }
    }
  });
}

Take a look at this

并为了关闭抽屉，使用Navigation.mergeOptions并传递可见的false

<Button onPress={this.hideSideMenu}/>

hideSideMenu() {
  Navigation.mergeOptions(this.props.componentId, {
    sideMenu: {
      left: {
        visible: false
      }
    }
  });
}

如何使用React Native Navigation v2添加侧边栏抽屉？

1 个答案: