🇬🇧 (EN | RU)

Navigator object

This is a main part of the library, most of the functionality is provided by it. To get navigator object you need to either call useNavigator:

import { useNavigator } from "vkui-navigation";

const Component = () => {
  const navigator = useNavigator();
};

or use withNavigator HOC to pass navigator in props:

import { withNavigator } from "vkui-navigation";

const Component = ({ navigator }) => {
  
};

const FinalComponent = withNavigator(Component);

Replacing VKUI

To handle navigation, you need to replace View/Root from VKUI with the ones from vkui-navigation. Note that some properties are different.

import { View } from "vkui-navigation";

return (
  <View homePanel="panel1">
    <Panel1 />
    <Panel2 />
  </View>
);

Name	Description
`homePanel`	Required. Default Panel ID

All the properties from original View are accepted except activePanel, history, popout and onSwipeBack.

import { Root } from "vkui-navigation";

return (
  <Root homeView="view1">
    <View1 />
    <View2 />
  </Root>
);

Name	Description
`homeView`	Required. Default View ID

All the properties from original Root are accepted except activeView.